JavaScript中变量声明有var和没var的区别示例介绍


Posted in Javascript onSeptember 15, 2014

本文来论述JavaScript中变量声明有var和没var的区别,关于Js中的变量声明的作用域是以函数为单位,所以我们经常见到避免全局变量污染的方法是

(function(){ 
// ... 
})();

在函数内部,有var和没var声明的变量是不一样的。有var声明的是局部变量,没var的,声明的全局变量,所以可以借此向外暴露接口东东。
在全局作用域内声明变量时,有var 和没var看起来都一样,我们知道,声明的全局变量,就是window的属性,究竟是否一样,我们通过ECMAScrpit5提供的属性的特性查询方法,来发现之间的区别。

var fff = 2; 
window.ffa = 3; 
ffb = 4; 
this.ffc = 4; 
var ffftx = Object.getOwnPropertyDescriptor(window, 'fff'); //configurable:false,enumerable:true,value:2,writable:true 
var ffatx = Object.getOwnPropertyDescriptor(window, 'ffa'); //configurable:true,enumerable:true,value:2,writable:true 
var ffbtx = Object.getOwnPropertyDescriptor(window, 'ffb'); //configurable:true,enumerable:true,value:2,writable:true 
var ffctx = Object.getOwnPropertyDescriptor(window, 'ffc'); //configurable:true,enumerable:true,value:2,writable:true

通过上面,发现,原来还是有差别的,我们再用delete删除属性来验证下,配置性为false的属性无法删除。也就是通过变量var声明全局对象的属性无法删除,我们还会发现和函数声明创建的全局对象属性也无法删除。

delete fff; // 无法删除 
delete ffa; // 可删除 
delete ffb; // 可删除 
delete ffc; // 可删除

结论就是,加上var 和没加 var的声明全局变量是有区别的。

使用var语句重复声明语句是合法且无害的。如果重复声明且带有赋值,那么就和一般的赋值语句没差别。如果尝试读取没有声明过的变量,Js会报错。
JavaScript的函数作用域内,声明的变量或内部函数,在函数体内都是可见的。意味着,函数在定义之前可能已经可用。函数定义有两种方式,一种是函数定义表达式,一种是函数声明语句。

// 函数定义表达式 
var fns = function (){ 
// ... 
}; 
// 函数声明语句 
function fns(){ 
// ... 
}

函数声明语句“被提前”到外部脚本或外部函数作用域的顶部,所以以这种方式声明的函数,可以被再它定义之前出现的代码所调用。而函数定义表达式中,变量的声明被提前了,但是给变量的赋值是不会提前的,所以,以表达式方式定义的函数在函数定义之前无法调用。

(function() { 
testa(); // 打印出testa 
testb(); // 报错:提示undefined is not a function 
console.log(testc); //undefined,如果移到上面就可以了 
function testa() { 
console.log("testa"); 
} 
var testb = function() { 
console.log("tesb"); 
} 
var testc = "testc"; 
})();

当然,我们声明变量和函数,必须遵守基本的规范,变量和函数声明要提前。

Javascript 相关文章推荐
Extjs学习笔记之五 一个小细节renderTo和applyTo的区别
Jan 07 Javascript
JSON+JavaScript处理JSON的简单例子
Mar 20 Javascript
火狐textarea输入法的bug的触发及解决
Jul 24 Javascript
用js格式化金额可设置保留的小数位数
May 09 Javascript
js数组的基本操作(很全自己整理的)
Oct 16 Javascript
JS使用正则表达式除去字符串中重复字符的方法
Nov 05 Javascript
vue-cli如何引入bootstrap工具的方法
Oct 19 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
Sep 04 Javascript
详解微信小程序中组件通讯
Oct 30 Javascript
Vue 的 v-model用法实例
Nov 23 Vue.js
Vue如何跨组件传递Slot的实现
Dec 14 Vue.js
原生js实现无缝轮播图效果
Jan 28 Javascript
JavaScript的arguments对象应用示例
Sep 15 #Javascript
avascript中的自执行匿名函数应用示例
Sep 15 #Javascript
JavaScript function 的 length 属性使用介绍
Sep 15 #Javascript
css与javascript跨浏览器兼容性总结
Sep 15 #Javascript
一个通过script自定义属性传递配置参数的方法
Sep 15 #Javascript
一个字符串反转函数可实现字符串倒序
Sep 15 #Javascript
jquery实现类似淘宝星星评分功能有截图
Sep 15 #Javascript
You might like
php横向重复区域显示二法
2008/09/25 PHP
JoshChen_php新手进阶高手不可或缺的规范介绍
2013/08/16 PHP
ThinkPHP实现附件上传功能
2017/04/27 PHP
swoole_process实现进程池的方法示例
2018/10/29 PHP
动态样式类封装JS代码
2009/09/02 Javascript
JavaScript中yield实用简洁实现方式
2010/06/12 Javascript
JavaScript创建对象的写法
2013/08/29 Javascript
将两个div左右并列显示并实现点击标题切换内容
2013/10/22 Javascript
使用script的src实现跨域和类似ajax效果
2014/11/10 Javascript
微信小程序  wx.request合法域名配置详解
2016/11/23 Javascript
JavaScript基于activexobject连接远程数据库SQL Server 2014的方法
2017/07/12 Javascript
node学习笔记之读写文件与开启第一个web服务器操作示例
2019/05/29 Javascript
node 版本切换的实现
2020/02/02 Javascript
vue element table中自定义一些input的验证操作
2020/07/18 Javascript
[52:39]完美世界DOTA2联赛PWL S3 CPG vs Forest 第一场 12.16
2020/12/17 DOTA
python 数据的清理行为实例详解
2017/07/12 Python
Python SVM(支持向量机)实现方法完整示例
2018/06/19 Python
django 做 migrate 时 表已存在的处理方法
2019/08/31 Python
selenium+Chrome滑动验证码破解二(某某网站)
2019/12/17 Python
如何基于python操作excel并获取内容
2019/12/24 Python
ansible动态Inventory主机清单配置遇到的坑
2020/01/19 Python
Python爬虫实例——scrapy框架爬取拉勾网招聘信息
2020/07/14 Python
突破canvas语法限制 让他支持链式语法
2012/12/24 HTML / CSS
Hush Puppies澳大利亚官网:舒适的男女休闲和正装鞋
2019/08/24 全球购物
毕业生个人投资创业计划书
2014/01/04 职场文书
班级寄语大全
2014/04/10 职场文书
事业单位鉴定材料
2014/05/25 职场文书
迎新春趣味活动方案
2014/08/24 职场文书
普通党员个人整改措施
2014/10/27 职场文书
2014年教师业务工作总结
2014/12/19 职场文书
保险公司增员口号
2015/12/25 职场文书
导游词之贵州织金洞
2019/10/12 职场文书
只需要100行Python代码就可以实现的贪吃蛇小游戏
2021/05/27 Python
Redis 彻底禁用RDB持久化操作
2021/07/09 Redis
使用CSS连接数据库的方式
2022/02/28 HTML / CSS
把77A收信机改造成收音机
2022/04/05 无线电