深入理解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 相关文章推荐
扩展jQuery对象时如何扩展成员变量具体怎么实现
Apr 25 Javascript
js图片预加载示例
Apr 30 Javascript
简述JavaScript提交表单的方式 (Using JavaScript Submit Form)
Mar 18 Javascript
js HTML5多图片上传及预览实例解析(不含前端的文件分割)
Aug 26 Javascript
判断数组的最佳方法(推荐)
Oct 11 Javascript
canvas实现刮刮卡效果
Mar 14 Javascript
JS实现新建文件夹功能
Jun 17 Javascript
一文让你彻底搞清楚javascript中的require、import与export
Sep 24 Javascript
基于滚动条位置判断的简单实例
Dec 14 Javascript
jquery ui 实现 tab标签功能示例【测试可用】
Jul 25 jQuery
关于angular引入ng-zorro的问题浅析
Sep 09 Javascript
Canvas三种动态画圆实现方法说明(小结)
Apr 16 Javascript
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
《魔兽世界》惊魂幻象将获得调整
2020/03/08 其他游戏
在同一窗体中使用PHP来处理多个提交任务
2006/10/09 PHP
PHP批量生成静态HTML的简单原理和方法
2014/04/20 PHP
PHP使用xpath解析XML的方法详解
2017/05/20 PHP
JavaScript 无符号右移运算符
2009/04/17 Javascript
学习ExtJS fit布局使用说明
2009/10/08 Javascript
jQuery 瀑布流 浮动布局(一)(延迟AJAX加载图片)
2012/05/23 Javascript
Js四则运算函数代码
2012/07/21 Javascript
js读取json的两种常用方法示例介绍
2014/10/19 Javascript
Nodejs的express使用教程
2015/11/23 NodeJs
JS组件Bootstrap按钮组与下拉按钮详解
2016/05/10 Javascript
jstl中判断list中是否包含某个值的简单方法
2016/10/14 Javascript
学习使用Bootstrap输入框、导航、分页等常用组件
2017/05/11 Javascript
详解如何使用webpack+es6开发angular1.x
2017/08/16 Javascript
jquery自定义显示消息数量
2017/12/19 jQuery
Vue中的v-for循环key属性注意事项小结
2018/08/12 Javascript
Angular中使用ng-zorro图标库部分图标不能正常显示问题
2019/04/22 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
2020/02/21 Javascript
VsCode里的Vue模板的实现
2020/08/12 Javascript
js实现筛选功能
2020/11/24 Javascript
使用grappelli为django admin后台添加模板
2014/11/18 Python
python入门教程之识别验证码
2017/03/04 Python
Python模块WSGI使用详解
2018/02/02 Python
python打包压缩、读取指定目录下的指定类型文件
2018/04/12 Python
python实现狄克斯特拉算法
2019/01/17 Python
详解Python3中ceil()函数用法
2019/02/19 Python
使用python搭建服务器并实现Android端与之通信的方法
2019/06/28 Python
python基于plotly实现画饼状图代码实例
2019/12/16 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
Casadei卡萨蒂官网:意大利奢侈鞋履品牌
2017/10/28 全球购物
如何提高MySql的安全性
2014/06/19 面试题
优秀员工获奖感言
2014/03/01 职场文书
2014会计年终工作总结
2014/12/20 职场文书
python 中的@运算符使用
2021/05/26 Python
RPM包方式安装Oracle21c的方法详解
2021/08/23 Oracle
html粘性页脚的具体使用
2022/01/18 HTML / CSS