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.ui.dialog 增加“在当前鼠标位置打开”的功能
Nov 24 Javascript
kmock javascript 单元测试代码
Feb 06 Javascript
js FLASH幻灯片字符串中有连接符&的处理方法
Mar 01 Javascript
JavaScript创建一个欢迎cookie弹出窗实现代码
Mar 15 Javascript
js二级地域选择的实现方法
Jun 17 Javascript
JavaScript中的Math 使用介绍
Apr 21 Javascript
jquery禁用右键示例
Apr 28 Javascript
js实现拉幕效果的广告代码
Sep 02 Javascript
Bootstrap实现默认导航栏效果
Sep 21 Javascript
每日十条JavaScript经验技巧(一)
Jun 23 Javascript
Electron 如何调用本地模块的方法
Feb 01 Javascript
vue中控制mock在开发环境使用,在生产环境禁用方式
Apr 06 Vue.js
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
详解:――如何将图片储存在数据库里
2006/12/05 PHP
php5新改动之短标记启用方法
2008/09/11 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
深入理解PHP内核(二)之SAPI探究
2015/11/10 PHP
CI框架扩展系统核心类的方法分析
2016/05/23 PHP
php array_values 返回数组的值实例详解
2016/11/17 PHP
PHP基于socket实现客户端和服务端通讯功能
2017/07/13 PHP
深入分析PHP设计模式
2020/06/15 PHP
使用Firebug对js进行断点调试的图文方法
2011/04/02 Javascript
jQuery $命名冲突解决方案汇总
2014/11/13 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
2015/10/29 Javascript
详解jquery事件delegate()的使用方法
2016/01/25 Javascript
js 获取站点应用名的简单实例
2016/08/18 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
2017/04/13 Javascript
Angular2学习教程之TemplateRef和ViewContainerRef详解
2017/05/25 Javascript
JavaScript中数组常见操作技巧
2017/09/01 Javascript
JS去掉字符串中所有的逗号
2017/10/18 Javascript
Node.js使用Express.Router的方法
2017/11/14 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
2018/05/16 Javascript
JS中的两种数据类型及实现引用类型的深拷贝的方法
2018/08/12 Javascript
微信小程序开发技巧汇总
2019/07/15 Javascript
js代码实现轮播图
2020/05/04 Javascript
js实现时间日期校验
2020/05/26 Javascript
js实现盒子拖拽动画效果
2020/08/09 Javascript
Python使用MYSQLDB实现从数据库中导出XML文件的方法
2015/05/11 Python
python增加图像对比度的方法
2019/07/12 Python
django 快速启动数据库客户端程序的方法示例
2019/08/16 Python
用Python 执行cmd命令
2020/12/18 Python
纯css3实现图片翻牌特效
2015/03/10 HTML / CSS
html5 浏览器支持 如何让所有的浏览器都支持HTML5标签样式
2012/12/07 HTML / CSS
外贸公司实习自我鉴定
2013/09/24 职场文书
车间统计员岗位职责
2015/04/14 职场文书
Mac环境Nginx配置和访问本地静态资源的实现
2021/03/31 Servers
关于springboot配置druid数据源不生效问题(踩坑记)
2021/09/25 Java/Android
Redis sentinel哨兵集群的实现步骤
2022/07/15 Redis