深入理解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 相关文章推荐
JavaScript对象模型-执行模型
Apr 28 Javascript
避免 showModalDialog 弹出新窗体的原因分析
May 31 Javascript
jQuery+CSS 半开折叠效果原理及代码(自写)
Mar 04 Javascript
解析js原生方法创建表格效率测试
Jul 08 Javascript
jQuery知识点整理
Jan 30 Javascript
JavaScript使用Max函数返回两个数字中较大数的方法
Apr 06 Javascript
jQuery基础的工厂函数以及定时器的经典实例分析
May 20 Javascript
ES6中Generator与异步操作实例分析
Mar 31 Javascript
Vue组件间通信方法总结(父子组件、兄弟组件及祖先后代组件间)
Apr 17 Javascript
微信小程序自定义单项选择器样式
Jul 25 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
Feb 03 Javascript
Vue 列表页带参数进详情页的操作(router-link)
Nov 13 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
Oracle 常见问题解答
2006/10/09 PHP
php下实现农历日历的代码
2007/03/07 PHP
PHP开发规范手册之PHP代码规范详解
2011/01/13 PHP
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
深入php var_dump()函数的详解
2013/06/05 PHP
使用迭代器 遍历文件信息的详解
2013/06/08 PHP
php 检查电子邮件函数(自写)
2014/01/16 PHP
PHP使用CURL实现对带有验证码的网站进行模拟登录的方法
2014/07/23 PHP
php获取远程图片并下载保存到本地的方法分析
2016/10/08 PHP
jquery 事件执行检测代码
2009/12/09 Javascript
JS 退出系统并跳转到登录界面的实现代码
2013/06/29 Javascript
jQuery控制TR显示隐藏的三种常用方法
2014/08/21 Javascript
浅谈Nodejs观察者模式
2015/10/13 NodeJs
AngularJS单选框及多选框实现双向动态绑定
2016/01/13 Javascript
阻止表单提交按钮多次提交的完美解决方法
2016/05/16 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
vue2.0开发入门笔记之.vue文件的生成和使用
2017/09/19 Javascript
vue 路由页面之间实现用手指进行滑动的方法
2018/02/23 Javascript
vue构建动态表单的方法示例
2018/09/22 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
小程序实现悬浮搜索框
2019/07/12 Javascript
微信小程序实现简单文字跑马灯
2020/05/26 Javascript
浅谈使用nodejs搭建web服务器的过程
2020/07/20 NodeJs
浅谈javascript事件环微任务和宏任务队列原理
2020/09/12 Javascript
[01:20]DOTA2上海特级锦标赛现场采访:谁的ID最受青睐
2016/03/25 DOTA
python进阶教程之函数参数的多种传递方法
2014/08/30 Python
python实现class对象转换成json/字典的方法
2016/03/11 Python
Python迭代和迭代器详解
2016/11/10 Python
用python写个自动SSH登录远程服务器的小工具(实例)
2017/06/17 Python
利用python和ffmpeg 批量将其他图片转换为.yuv格式的方法
2019/01/08 Python
python matplotlib中的subplot函数使用详解
2020/01/19 Python
创建文明学校实施方案
2014/03/11 职场文书
感恩之星事迹材料
2014/05/03 职场文书
安全生产月活动总结
2014/05/04 职场文书
应届生求职自荐信
2014/07/04 职场文书
副总经理岗位职责范本
2014/09/30 职场文书