深入理解javascript变量声明


Posted in Javascript onNovember 20, 2014

相对于C/C++来说,ECMAScript里的for循环并不能创建一个局部的上下文。

for (var k in {a: 1, b: 2}) {

  alert(k);

}

alert(k); // 尽管循环已经结束但变量k依然在当前作用域
任何时候,变量只能通过使用var关键字才能声明。
 
上面的赋值语句:
 
a = 10;
这仅仅是给全局对象创建了一个新属性(但它不是变量)。“不是变量”并不是说它不能被改变,而是指它不符合ECMAScript规范中的变量概念,所以它“不是变量”(它之所以能成为全局对象的属性,完全是因为javascript中存在一个global对象,这样的操作不是声明一个变量而是给global对象增加一个a属性。
 
下面看一个简单的例题来说明问题

if (!("a" in window)) {

    var a = 1;

}

alert(a);

首先,所有的全局变量都是window的属性,语句 var a = 1;等价于window.a = 1;
 
你可以用如下方式来检测全局变量是否声明
 
"变量名称" in window

第二,所有的变量声明都在范围作用域的顶部,看一下相似的例子:
 

alert("a" in window);

var a;

此时,尽管声明是在alert之后,alert弹出的依然是true,这是因为JavaScript引擎首先会扫墓所有的变量声明,然后将这些变量声明移动到顶部,最终的代码效果是这样的:

var a;

alert("a" in window);

第三,你需要理解该题目的意思是,变量声明被提前了,但变量赋值没有,因为这行代码包括了变量声明和变量赋值。

你可以将语句拆分为如下代码:

var a;    //声明

a = 1;    //初始化赋值

所以总结起来就是当变量声明和赋值在一起用的时候,JavaScript引擎会自动将它分为两部以便将变量声明提前,不将赋值的步骤提前是因为他有可能影响代码执行出不可预期的结果。

题目中的代码相当于:

var a;

if (!("a" in window)) {

    a = 1;

}

alert(a);

根据上述例题的分析,声明变量时如果是声明的局部变量前面一定要加var,如果声明的是全局变量可以不加var(最好限制全局变量的个数,尽量使用局部变量)

下面讲述一个使用var的几个特性

使用var语句多次声明一个变量不仅是合法的,而且也不会造成任何错误。
如果重复使用的一个声明有一个初始值,那么它担当的不过是一个赋值语句的角色。
如果重复使用的一个声明没有一个初始值,那么它不会对原来存在的变量有任何的影响。
没有var声明的变量,是作为全局变量存在的;有var声明的变量,属于局部变量,尤其是在函数内部。并且,经过测试,带var声明比不带var速度要快。函数内尽量多设局部变量,这样即安全又快速,变量操作也更加合理,不会因为函数内胡乱操作全局变量而导致逻辑错误。

声明对象时最好使用对象自面量的方式,这样的速度相对new的方式要快很多。

变量名是自己取的,为了照顾语义和规范,变量名可能稍长,但是注意了,变量名的长度也会影响代码的执行速度。长的变量名声明的执行速度没有短的快。

Javascript 相关文章推荐
使用js实现数据格式化
Dec 03 Javascript
javascript中parseInt()函数的定义和用法分析
Dec 20 Javascript
JSONP之我见
Mar 24 Javascript
在JavaScript中使用开平方根的sqrt()方法
Jun 15 Javascript
jQuery实现自定义checkbox和radio样式
Jul 13 Javascript
jQuery层级选择器实例代码
Feb 06 Javascript
关于js的三种使用方式(行内js、内部js、外部js)的程序代码
May 05 Javascript
angularJs在多个控制器中共享服务数据的方法
Sep 30 Javascript
vue swipeCell滑动单元格(仿微信)的实现示例
Sep 14 Javascript
JS实现纸牌发牌动画
Jan 19 Javascript
k8s node节点重新加入master集群的实现
Feb 22 Javascript
vue3中provide && inject的使用
Jul 01 Vue.js
javascript限制用户只能输汉字中文的方法
Nov 20 #Javascript
jQuery 中$(this).index与$.each的使用指南
Nov 20 #Javascript
jQuery提示效果代码分享
Nov 20 #Javascript
IE6浏览器中window.location.href无效的解决方法
Nov 20 #Javascript
js判断滚动条是否已到页面最底部或顶部实例
Nov 20 #Javascript
js中数组排序sort方法的原理分析
Nov 20 #Javascript
javascript继承机制实例详解
Nov 20 #Javascript
You might like
PHP eval函数使用介绍
2013/12/08 PHP
PHP CodeIgniter框架的工作原理研究
2015/03/30 PHP
js算法中的排序、数组去重详细概述
2013/10/14 Javascript
JS实现时间格式化的方式汇总
2013/10/16 Javascript
js 跳出页面的frameset框架示例介绍
2013/12/23 Javascript
javascript生成json数据简单示例分享
2014/02/14 Javascript
JavaScript实现获取dom中class的方法
2015/02/09 Javascript
jquery实现select下拉框美化特效代码分享
2015/08/18 Javascript
jQuery获取DOM节点实例分析(2种方式)
2015/12/15 Javascript
vue.js入门教程之基础语法小结
2016/09/01 Javascript
jQuery实现radio第一次点击选中第二次点击取消功能
2017/05/15 jQuery
详解nodejs中express搭建权限管理系统
2017/09/15 NodeJs
angular基于ng-alain定义自己的select组件示例
2018/02/23 Javascript
nodejs基于express实现文件上传的方法
2018/03/19 NodeJs
vue.js内置组件之keep-alive组件使用
2018/07/10 Javascript
Vue2.0生命周期的理解
2018/08/20 Javascript
微信小程序map组件结合高德地图API实现wx.chooseLocation功能示例
2019/01/23 Javascript
PHP实现基于Redis的MessageQueue队列封装操作示例
2019/02/02 Javascript
layer.msg()去掉默认时间,实现手动关闭的方法
2019/09/12 Javascript
详解vue 自定义组件使用v-model 及探究其中原理
2019/10/11 Javascript
centos下更新Python版本的步骤
2013/02/12 Python
Python中XlsxWriter模块简介与用法分析
2018/04/24 Python
ansible动态Inventory主机清单配置遇到的坑
2020/01/19 Python
Pytest框架之fixture的详细使用教程
2020/04/07 Python
CSS3制作炫酷带方向感应的鼠标滑过图片3D动画
2016/03/16 HTML / CSS
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
办公室人员先进事迹
2014/01/27 职场文书
市场营销大学生职业规划书
2014/02/25 职场文书
2014年新生军训方案
2014/05/01 职场文书
干部对照检查材料范文
2014/08/26 职场文书
小学生推普周国旗下讲话稿
2014/09/21 职场文书
党的群众路线教育实践活动个人整改措施落实情况
2014/11/04 职场文书
给领导的感谢信范文
2015/01/23 职场文书
团委工作总结2015
2015/04/02 职场文书
2015年社区科普工作总结
2015/05/13 职场文书
2015年仓库管理工作总结
2015/05/25 职场文书