深入理解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实现运动logo图片效果及运动元素对象sportBox使用方法
Dec 25 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 Javascript
jquery 实现二级/三级/多级联动菜单的思路及代码
Apr 08 Javascript
浅谈JS闭包中的循环绑定处理程序
Nov 09 Javascript
js倒计时简单实现方法
Dec 17 Javascript
jQuery操作属性和样式详解
Apr 13 Javascript
AngularJs中Bootstrap3 datetimepicker使用实例
Dec 13 Javascript
React为 Vue 引入容器组件和展示组件的教程详解
May 03 Javascript
原生JS实现DOM加载完成马上执行JS代码的方法
Sep 07 Javascript
Vue学习之组件用法实例详解
Jan 06 Javascript
vue之封装多个组件调用同一接口的案例
Aug 11 Javascript
原生js生成图片验证码
Oct 11 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
洪恩在线成语词典小偷程序php版
2012/04/20 PHP
PHP5各个版本的新功能和新特性总结
2014/03/16 PHP
分享常见的几种页面静态化的方法
2015/01/08 PHP
老生常谈php 正则中的i,m,s,x,e分别表示什么
2017/03/02 PHP
PHP基于MySQLI函数封装的数据库连接工具类【定义与用法】
2017/08/11 PHP
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
使用jquery.qrcode生成彩色二维码实例
2014/08/08 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
js实现图片和链接文字同步切换特效的方法
2015/02/20 Javascript
AngularJS的内置过滤器详解
2015/05/14 Javascript
jQuery实现列表内容的动态载入特效
2015/08/08 Javascript
JS读写CSS样式的方法汇总
2016/08/16 Javascript
js 数组详细操作方法及解析合集
2018/06/01 Javascript
vue 内置过滤器的使用总结(附加自定义过滤器)
2018/12/11 Javascript
使用原生JS实现滚轮翻页效果的示例代码
2020/05/31 Javascript
在vue-cli创建的项目中使用sass操作
2020/08/10 Javascript
[02:38]DOTA2超级联赛专访Loda 认为IG世界最强
2013/05/27 DOTA
学习python的几条建议分享
2013/02/10 Python
Python编程入门之Hello World的三种实现方式
2015/11/13 Python
详解python发送各类邮件的主要方法
2016/12/22 Python
python日志记录模块实例及改进
2017/02/12 Python
python3.5 tkinter实现页面跳转
2018/01/30 Python
Python3.4学习笔记之列表、数组操作示例
2019/03/01 Python
PyQt4编程之让状态栏显示信息的方法
2019/06/18 Python
python设置环境变量的作用和实例
2019/07/09 Python
在Mac中PyCharm配置python Anaconda环境过程图解
2020/03/11 Python
python正则表达式的懒惰匹配和贪婪匹配说明
2020/07/13 Python
python opencv图像处理(素描、怀旧、光照、流年、滤镜 原理及实现)
2020/12/10 Python
一款纯css3实现的鼠标悬停动画按钮
2014/12/29 HTML / CSS
YesBabyOnline美国:全球性的在线婚纱礼服工厂
2018/05/05 全球购物
台湾家适得:Homeget
2019/02/11 全球购物
售后服务经理岗位职责范本
2014/02/22 职场文书
个人买房协议书范本
2014/10/06 职场文书
幼儿园教研工作总结2015
2015/05/12 职场文书
创业计划书介绍
2019/04/24 职场文书
python状态机transitions库详解
2021/06/02 Python