javascript中加var和不加var的区别 你真的懂吗


Posted in Javascript onJanuary 06, 2016

Javascript是遵循ECMAScript标准下的一个产物,自然ECMAScript的标准其要遵循。

先来看下var关键字的定义和用法

var 语句用于声明变量。

JavaScript 变量的创建也叫作"声明"一变量:

var carName;

变量声明后,变量为空 (没有值)。

为变量复制,操作如下:

carName = "Volvo";

声明变量时,你同样可以为变量赋值:

var carName = "Volvo";

语法

var varname = value;

参数值

 

参数 描述
varname 必须。指定变量名。 变量名可以包含字母,数字,下划线和美元符号。 变量名必须以字母开头 变量名也可以以$和_开头(但一般不这么用) 变量名是大小写敏感的(y和Y是不同的变量) 保留字(如JavaScript关键字)不能作为变量名使用
value 可选。指定变量的值。注意: 如果变量声明未指定值,其默认值为 undefined

大家都看了很多文章,都说避免隐式声明全局变量,就是说声明变量前必须加'var',那加了'var'和不加'var'到底有啥区别呢?

 先来看一段代码

var a = 'aa';
alert(a); //弹出 'aa'
alert(window.a)//弹出'aa'

明白了吧,你声明一个全局变量其实是给'window'对象增加了一个属性,下面一段代码有相同效果

a = 'aa';
alert(a); //弹出 'aa'
alert(window.a)//弹出'aa'

那"var a = 'aa' " 和 "a = 'aa' " 都是全局变量,有啥区别了? 看下面两段段代码

var a = 'aa';
delete window.a; // false 
a = 'aa';
delete window.a; // true

都是为'window'对象增加了属性,一个可以删除,一个不能删除。但是加上'var'就可以作用域相关了,不加'var'始终都是在为'window'对象动态添加属性,以下代码为证

var test = function(){
 a = 'aa';
}
test();
alert(window.a);//弹出'aa'

 由于window对象是全局对象,因此默认可以不加,下面这段同样效果

var test = function(){
 a = 'aa';
}
test();
alert(a);//弹出'aa'

说到这,认真思考的同学现在必然有个疑问, 为啥隐式声明的全局变量可以删除,显式声明的全局变量就无法删除?

原因是"delete 不可以删除那些可配置性为false的属性" ,某些内置对象的属性是不可配置的,比如通过变量声明或者函数声明创建的全局对象的属性,以下代码为证

delete Object.prototype; // false 不可删除,该属性是不可配置的
var a = 'aa';
delete window.a;//false 不可删除,该属性是不可配置的
function test(){};
delete window.test;//false 不可删除,该属性是不可配置的

那这样不就明白了,通过'var'声明的全局变量,其实际上是为'window'对象增加了一个不可配置的属性, 而不加'var'声明的全局变量,其实际上是为'window'对象增加了一个可以配置的属性。

注意了,以上使用window的地方,window都可以用this代替,如:

var test = function(){
 a = 'aa';
}
test();
alert(this.a);//弹出'aa'

至于原因,请查看鄙人之前写的文章 'this,this,再次讨论javascript中的this,超全面'

下面拉出javascript中的var关键字,给大家单独讲解。

我们知道定义变量的时候,我们需要用到Var关键字,使用Var关键字时,我们需要注意他的使用方法:
下面几个列子,充分说明了Var在使用和不使用、全局变量和局部变量定义时,有不同的执行结果。

var var01 = 1;
function funtest() {
 document.write(var01);
 var var01 = 0;
}

结果为:undefined

var var01 = 1;
function funtest() {
 document.write(var01);
 var01 = 0;
}

结果为:1

var01 = 1;
function funtest() {
 document.write(var01);
 var var01 = 0;
}

结果为:undefined

var01 = 1;
function funtest() {
 document.write(var01);
 var01 = 0;
}

结果为:1

看到这里对javascript中的var你了解多少,相信大家通过本文学习多多少少都会有点收获的吧。欲了解更多关于javascript var相关知识请持续关注本站,谢谢!

Javascript 相关文章推荐
添加到收藏夹代码(兼容几乎所有的浏览器)
Jan 09 Javascript
javascript 强制刷新页面的实现代码
Dec 13 Javascript
JavaScript中常见陷阱小结
Apr 27 Javascript
jquery中ajax调用json数据的使用说明
Mar 17 Javascript
JQuery AJAX 中文乱码问题解决
Jun 05 Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 Javascript
JavaScript使用function定义对象并调用的方法
Mar 23 Javascript
JavaScript中的操作符类型转换示例总结
May 30 Javascript
AngularJS轻松实现双击排序的功能
Aug 30 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
Dec 16 Javascript
关于Vue的路由权限管理的示例代码
Mar 06 Javascript
详解微信小程序之scroll-view的flex布局问题
Jan 16 Javascript
JavaScript引用类型和基本类型详解
Jan 06 #Javascript
js模仿java的Map集合详解
Jan 06 #Javascript
JavaScript中iframe实现局部刷新的几种方法汇总
Jan 06 #Javascript
JavaScript iframe数据共享接口实现方法
Jan 06 #Javascript
js实现仿qq消息的弹出窗效果
Jan 06 #Javascript
2016年最热门的15 款代码语法高亮工具,美化你的代码
Jan 06 #Javascript
详解jQuery Mobile自定义标签
Jan 06 #Javascript
You might like
php+javascript的日历控件
2009/11/19 PHP
PHP 接入支付宝即时到账功能
2016/09/18 PHP
php+webSoket实现聊天室示例代码(附源码)
2017/02/17 PHP
番茄的表单验证类代码修改版
2008/07/18 Javascript
jQuery之end()和pushStack()使用介绍
2012/02/07 Javascript
jQuery实现点击标题输入详细信息
2013/04/16 Javascript
解决Jquery load()加载GB2312页面时出现乱码的两种方案
2013/09/10 Javascript
jquery给图片添加鼠标经过时的边框效果
2013/11/12 Javascript
Extjs grid添加一个图片状态或者按钮的方法
2014/04/03 Javascript
jQuery文件上传插件Uploadify使用指南
2014/06/05 Javascript
在AngularJS框架中处理数据建模的方式解析
2016/03/05 Javascript
jQuery中的通配符选择器使用总结
2016/05/30 Javascript
JavaScript的instanceof运算符学习教程
2016/06/08 Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
2016/07/11 Javascript
js中的DOM模拟购物车功能
2017/03/22 Javascript
layui关闭弹窗后刷新主页面和当前更改项的例子
2019/09/06 Javascript
小程序实现图片预览裁剪插件
2019/11/22 Javascript
Python中exit、return、sys.exit()等使用实例和区别
2015/05/28 Python
Python时间模块datetime、time、calendar的使用方法
2016/01/13 Python
浅析AST抽象语法树及Python代码实现
2016/06/06 Python
python制作抖音代码舞
2019/04/07 Python
让你Python到很爽的加速递归函数的装饰器
2019/05/26 Python
Ubuntu下Anaconda和Pycharm配置方法详解
2019/06/14 Python
Django实现简单网页弹出警告代码
2019/11/15 Python
python多进程使用函数封装实例
2020/05/02 Python
Keras框架中的epoch、bacth、batch size、iteration使用介绍
2020/06/10 Python
Html5自定义字体解决方法
2019/10/09 HTML / CSS
德国团购网站:Groupon德国
2018/03/13 全球购物
捷克家具销售网站:SCONTO Nábytek
2020/01/02 全球购物
优秀教师获奖感言
2014/01/31 职场文书
学生感冒英文请假条
2014/02/04 职场文书
毕业生就业协议书
2014/04/11 职场文书
体育馆的标语
2014/06/24 职场文书
《绝招》教学反思
2016/02/20 职场文书
2016年学校“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
Python实现视频中添加音频工具详解
2021/12/06 Python