《javascript模式》 容易踩中的那些坑
1 链式赋值的陷阱
1: function func(){2: var innerVar = globalVar = 20; 3: }4: func();5: console.log(typeof globalVar); //输出结果为?
上面最后的输出结果是?相信不少人会毫不犹豫地说undefined,确定?
真相是:number
原因:从右至左操作符的优先级。首先,优先级较高的是表达式b=0,此时b未经声明。表达式的返回值为0,它被赋给var声明的局部变量a,如以下代码所示
var a = (b = 0);
建议:对链式赋值的所以变量都进行声明,再进行赋值
1: function foo() {
2: var a, b;
3: a = b = 20; //都是局部变量
4: }
2 变量释放时的副作用
隐含全局变量与明确定义的全局变量有细微的不同,不同之处在于能否使用delete操作符撤销变量
- 使用var创建的全局变量(这类变量在函数外部创建),不能删除
- 不使用var创建的隐含全局变量(尽管它是在函数内部创建),可以删除
这表明隐含全局变量严格来讲不是真正的变量,而是全局对象的属性。属性可以通过delete操作符删除,但变量不可以
//定义三个全局变量
var global_var = 1;
global_novar = 2; //反模式
(function(){global_fromfunc = 3; //反模式
})();//企图删除
delete global_var; //false
delete global_novar; //true
delete global_fromfunc; //true//测试删除情况
typeof global_var; //'number'
typeof global_novar; //'undefined'
typeof global_fromfunc; //'undefined'
在ES5 strict模式中,为没有声明的变量赋值会抛出错误
3 for-in的陷阱
1: function func(){2: var innerVar = globalVar = 20; 3: }4: func();5: console.log(typeof globalVar); //输出结果为?
将上述代码稍微修改下又如何呢?
1: var person = {
2: name: 'casper',
3: age: 11
4: };
5: Object.prototype.getName = function(){};
6: for(var key in person){
7: console.log(key);
8: }
输出结果变成:
输出:name输出:age输出:getName
建议:不要增加内置对象的原型,除非必要,同时需在团队内进行良好的沟通,确保其他团队成员不会因此而遇到一些奇怪的错误
4 注意eval与new Function之间的差别
- eval()会影响到作用域
- new Function()中的代码将在局部函数空间中运行,因此代码中任何采用var定义的变量不会自动成为全局变量
- 无论在哪里执行Function,它都仅能看到全局作用域
1: console.log(typeof un); //'undefined'
2: console.log(typeof deux); //'undefined'
3: console.log(typeof trois); //'undefined'
4:
5: var jsstring = "var un = 1; console.log(un);";
6: eval(jsstring); //logs "1"
7:
8: jsstring = "var deux = 2; console.log(deux);";
9: new Function(jstring)(); //logs "2"
10:
11: jsstring = "var trois = 3; console.log(trois);";
12: (function(){
13: eval(jsstring);
14: })(); //logs "3"
15:
16: console.log(un); //'number'
17: console.log(typeof deux); //'number'
18: console.log(typeof trois); //'undefined'
从上面代码示例可以很清楚地看出前两点,关于第三点,请看下面代码示例:
1: (function(){
2: var local = 1;
3: eval("local = 2; console.log(local);"); //logs 3
4: console.log(local); //logs 3
5: })();
6:
7: (function(){
8: var local = 1;
9: new Function("console.log(typeof local);")(); //logs 'undefined'
10: })();
《javascript模式》 容易踩中的那些坑相关推荐
- VCSA6.7-VCSA7.0部署经常踩中的坑【 两个 】
VCSA6.7-VCSA7.0部署经常踩中的坑[ 俩! ] 坑1:vcsa[安装80%报错]·无法进入第二阶段 vcsa安装到达80%后,无法进入第二阶段,通过"IP:5480"进 ...
- 基于Vue2实现的仿手机QQapp(支持对话功能,滑动删除....)—— 聊聊开发过程中踩到的一些坑与解决方案,以及个人感悟...
使用Vue2进行的仿手机QQ的webapp的制作,在ui上,参考了设计师kaokao的作品,作品由个人独立开发,源码中进行了详细的注释. 由于自己也是初学Vue2,所以注释写的不够精简,请见谅. 目前 ...
- SEO网站排名刷量代码中的一些坑
今天上半年为了满足客户网站的排名需求,在大环境不好的情况下开辟一些新客户,公司特别组织我们几个资深研发人员成立了一个研发小组,来专门研发了这款网站SEO网站排名刷量工具,目的是帮助客户网站迅速提升热度 ...
- mysql表分区占用存储_MySQL 分区分表应用场景分析和分区中可能遇到的坑点
MySQL的分区和分表应用场景分析 在日常工作中当我们的某张表的数据量过大的时候,首当其冲的可能就是进行分区和分表,但是是如何分区或者分表都要结合一点的业务场景下进行分析,才会显著的提升性能,来聊一聊 ...
- 安装python爬虫scrapy踩过的那些坑和编程外的思考
'转载地址:http://www.cnblogs.com/rwxwsblog/p/4557123.html' 这些天应朋友的要求抓取某个论坛帖子的信息,网上搜索了一下开源的爬虫资料,看了许多对于开源爬 ...
- JavaScript将在企业环境中引发巨大变革
根据Forrester公司的报告,JavaScript与Node.js将给Java等企业常用的技术方案带来巨大转变. JavaScript目前已经广泛普及,而服务器端Node.js运行时环境则已经成为 ...
- Vue2.0配置mint-ui踩过的那些坑
Vue2.0配置mint-ui踩过的那些坑 最近开发项目的时候逐渐采用vue.js+mint-ui的技术栈,但是昨天开始配置开发环境的时候,遇到了各种报错,即使是按照两家的官方文档配置,也还是会报错, ...
- 常用的JavaScript模式
常用的JavaScript模式 模式是解决或者避免一些问题的方案. 在JavaScript中,会用到一些常用的编码模式.下面就列出了一些常用的JavaScript编码模式,有的模式是为了解决特定的问题 ...
- Javascript模式阅读笔记 · 简介
JavaScript是一门基于Web的语言.它最初是作为在网页中操作一些特定类型元素(例如图像和表格字段)的方法,现在该语言的发展已经远远超出了预期.除了作为客户端浏览器所使用的脚本,现在JavaSc ...
最新文章
- 软考总结——虚存管理
- 发票统计者 V1.0
- 台湾国立大学郭彦甫Matlab教程笔记(13) 3D
- 科大星云诗社动态20210830
- WebRTC 的 AudioSource/AudioTrack
- UE3 性能调试:动态光照环境
- 北京移动联合中兴通讯率先完成SON 4/5G全制式规模部署
- 以后外卖还可以买手机了!饿了么与上海迪信通达成合作
- 使用Span T 提高C#代码的性能
- 胡伟武计算机体系结构2版pdf_最新重大版重庆高中英语必修模块1/2/3/4课文听力单词录音MP3音频+电子课本PDF+课件+教案+试题...
- 数据结构与算法:十大排序算法之归并排序
- Centos下yum update与yum upgrade的区别
- 计算机四级网络工程师(计算机网络单选)- 知识点
- 计算机考试多选试题及答案,计算机中级职称考试试题及答案 [2018职称计算机考试WPS_Office多选试题及答案]...
- java屏幕共享实现原理_远程桌面共享技术实现
- docker容器的前台后台运行
- 电动汽车相关功率计算
- 北京工作居住证续签注意的问题
- 多个excel工作簿、工作表合并
- ColorOS 13流畅吗?看OPPO在系统上做了哪些升级?