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 相关文章推荐
jquery移除button的inline onclick事件(已测试及兼容浏览器)
Jan 25 Javascript
用js写了一个类似php的print_r输出换行功能
Feb 18 Javascript
js计算字符串长度包含的中文是utf8格式
Oct 15 Javascript
JavaScript省市联动实现代码
Feb 15 Javascript
HTML,CSS,JavaScript速查表推荐
Dec 02 Javascript
javascript 操作符(~、&、|、^、)使用案例
Dec 31 Javascript
jquery实现简单实用的弹出层效果代码
Oct 15 Javascript
探索webpack模块及webpack3新特性
Sep 18 Javascript
AngularJS中的路由使用及实现代码
Oct 09 Javascript
node使用Koa2搭建web项目的方法
Oct 17 Javascript
Node层模拟实现multipart表单的文件上传示例
Jan 02 Javascript
vue form 表单提交后刷新页面的方法
Sep 04 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调用Oracle存储过程
2006/10/09 PHP
对squid中refresh_pattern的一些理解和建议
2009/04/17 PHP
PHP面向对象学习笔记之二 生成对象的设计模式
2012/10/06 PHP
php cli模式学习(PHP命令行模式)
2013/06/03 PHP
PHP后期静态绑定实例浅析
2018/12/21 PHP
Chrome中模态对话框showModalDialog返回值问题的解决方法
2010/05/25 Javascript
jquery实现pager控件示例
2014/04/09 Javascript
基于jquery实现可定制的web在线富文本编辑器附源码下载
2015/11/17 Javascript
js从数组中删除指定值(不是指定位置)的元素实现代码
2016/09/13 Javascript
前端面试知识点锦集(JavaScript篇)
2016/12/28 Javascript
Bootstrap3 内联单选和多选框
2016/12/29 Javascript
javascript使用递归算法求两个数字组合功能示例
2017/01/03 Javascript
vue.js中v-on:textInput无法执行事件问题的解决过程
2017/07/12 Javascript
nodejs通过钉钉群机器人推送消息的实现代码
2019/05/05 NodeJs
vue cli3.0打包上线静态资源找不到路径的解决操作
2020/08/03 Javascript
[02:04]2014DOTA2国际邀请赛 BBC小组赛第三天总结
2014/07/12 DOTA
[01:01]2020完美高校联赛(秋)西安落幕
2021/03/11 DOTA
python发送邮件接收邮件示例分享
2014/01/21 Python
python实现爬虫统计学校BBS男女比例之数据处理(三)
2015/12/31 Python
Python多层嵌套list的递归处理方法(推荐)
2016/06/08 Python
python中is与双等于号“==”的区别示例详解
2017/11/21 Python
详解python3中tkinter知识点
2018/06/21 Python
Python Pandas 获取列匹配特定值的行的索引问题
2019/07/01 Python
python将excel转换为csv的代码方法总结
2019/07/03 Python
Python切割图片成九宫格的示例代码
2020/03/10 Python
python入门:argparse浅析 nargs='+'作用
2020/07/12 Python
CSS3实现3D翻书效果
2016/06/20 HTML / CSS
美国批发零售网站:GearXS
2016/07/26 全球购物
奥地利婴儿用品和玩具购物网站:baby-markt.at
2020/01/26 全球购物
高校辅导员推荐信范文
2013/12/25 职场文书
家长给孩子的表扬信
2014/01/17 职场文书
大学生学习2014年全国两会心得体会
2014/03/12 职场文书
党员公开承诺书范文
2014/03/25 职场文书
员工安全责任书范本
2014/07/24 职场文书
2015年大学生入党自荐书
2015/03/24 职场文书
《狼牙山五壮士》教学反思
2016/02/17 职场文书