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 相关文章推荐
基于jQuery实现的当离开页面时出现提示的实现代码
Jun 27 Javascript
jQuery控制图片的hover效果(smartRollover.js)
Mar 18 Javascript
js统计页面的来访次数实现代码
May 09 Javascript
JavaScript AJAX之惰性载入函数
Aug 27 Javascript
JavaScript给按钮绑定点击事件(onclick)的方法
Apr 07 Javascript
js实现搜索框关键字智能匹配代码
Mar 26 Javascript
微信小程序中的swiper组件详解
Apr 14 Javascript
angular2中使用第三方js库的实例
Feb 26 Javascript
React 组件中的 bind(this)示例代码
Sep 16 Javascript
在Layui中实现开关按钮的效果实例
Sep 29 Javascript
js实现html滑动图片拼图验证
Jun 24 Javascript
探索浏览器页面关闭window.close()的使用详解
Aug 21 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
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
php set_time_limit()函数的使用详解
2013/06/05 PHP
thinkphp利用模型通用数据编辑添加和删除的实例代码
2016/11/20 PHP
枚举JavaScript对象的函数
2006/12/22 Javascript
xml文档转换工具,附图表例子(hta)
2010/11/17 Javascript
JavaScript学习笔记之数组去重
2016/03/23 Javascript
JS实现关闭当前页而不弹出提示框的方法
2016/06/22 Javascript
关于JS 预解释的相关理解
2016/06/28 Javascript
jQuery禁用快捷键例如禁用F5刷新 禁用右键菜单等的简单实现
2016/08/31 Javascript
javascript 动态样式添加的简单实现
2016/10/11 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
js实现刷新页面后回到记录时滚动条的位置【两种方案可选】
2016/12/12 Javascript
微信小程序 自己制作小组件实例详解
2016/12/22 Javascript
浅谈JavaScript的函数及作用域
2016/12/30 Javascript
vue单页应用加百度统计代码(亲测有效)
2018/01/31 Javascript
jQuery实现的点击按钮改变样式功能示例
2018/07/21 jQuery
在NPM发布自己造的轮子的方法步骤
2019/03/09 Javascript
jQuery+ajax实现批量删除功能完整示例
2019/06/06 jQuery
JQuery获得内容和属性方法解析
2020/05/30 jQuery
Vue跨域请求问题解决方案过程解析
2020/08/07 Javascript
Python中对列表排序实例
2015/01/04 Python
10分钟教你用python动画演示深度优先算法搜寻逃出迷宫的路径
2019/08/12 Python
python 实现绘制整齐的表格
2019/11/18 Python
Python 实现一个计时器
2020/07/28 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
HTML5 文件域+FileReader 分段读取文件并上传到服务器
2017/10/23 HTML / CSS
韩都衣舍天猫官方旗舰店:天猫女装销售总冠军
2017/10/10 全球购物
Wojas罗马尼亚网站:波兰皮鞋品牌
2018/11/01 全球购物
城建学院毕业生自荐信
2014/01/31 职场文书
公务员转正鉴定材料
2014/02/11 职场文书
工商管理专业大学生职业生涯规划范文
2014/03/09 职场文书
房屋继承公证书
2014/04/10 职场文书
2014年学习厉行节约反对浪费思想汇报
2014/09/10 职场文书
小学校长开学致辞
2015/07/29 职场文书
Pytorch使用shuffle打乱数据的操作
2021/05/20 Python
HTML基础详解(上)
2021/10/16 HTML / CSS