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 相关文章推荐
javascript通过className来获取元素的简单示例代码
Jan 10 Javascript
JS往数组中添加项性能分析
Feb 25 Javascript
jQuery EasyUI 布局之动态添加tabs标签页
Nov 18 Javascript
jquery实现表单验证简单实例演示
Nov 23 Javascript
JavaScript弹窗基础篇
Apr 27 Javascript
利用JS实现文字的聚合动画效果
Jan 22 Javascript
bootstrap table实现点击翻页功能 可记录上下页选中的行
Sep 28 Javascript
解决vue-router进行build无法正常显示路由页面的问题
Mar 06 Javascript
解决$store.getters调用不执行的问题
Nov 08 Javascript
javascript实现简单搜索功能
Mar 26 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
Aug 10 Javascript
js在HTML的三种引用方式详解
Aug 29 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生成N个不重复的随机数实例
2013/11/12 PHP
wamp服务器访问php非常缓慢的解决过程
2015/07/01 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
php使用mysqli和pdo扩展,测试对比mysql数据库的执行效率完整示例
2019/05/09 PHP
PHP的静态方法与普通方法用法实例分析
2019/09/26 PHP
PHP简单实现图片格式转换(jpg转png,gif转png等)
2019/10/30 PHP
用javascript获取地址栏参数
2006/12/22 Javascript
javascript 通用简单的table选项卡实现
2010/05/07 Javascript
基于jquery的划词搜索实现(备忘)
2010/09/14 Javascript
JS对HTML标签select的获取、添加、删除操作
2013/10/17 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
2015/03/03 Javascript
JS动态修改iframe内嵌网页地址的方法
2015/04/01 Javascript
JavaScript通过事件代理高亮显示表格行的方法
2015/05/27 Javascript
jquery图片倾斜层叠切换特效代码分享
2015/08/27 Javascript
js实现字符串和数组之间相互转换操作
2016/01/12 Javascript
react 应用多入口配置及实践总结
2018/10/17 Javascript
vue 源码解析之虚拟Dom-render
2019/08/26 Javascript
[02:34]DOTA2亚洲邀请赛 BG战队出场宣传片
2015/03/09 DOTA
对numpy数据写入文件的方法讲解
2018/07/09 Python
python创建文件时去掉非法字符的方法
2018/10/31 Python
Python标准库json模块和pickle模块使用详解
2020/03/10 Python
Python实现疫情地图可视化
2021/02/05 Python
很酷的HTML5电子书翻页动画特效
2016/02/25 HTML / CSS
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
100%植物性、有机、即食餐:Sakara Life
2018/10/25 全球购物
英国最大的纸工艺品商店:CraftStash
2018/12/01 全球购物
Speedo速比涛法国官方网站:泳衣、泳镜、泳帽、泳裤
2019/07/30 全球购物
Tessabit日本:集世界奢侈品和设计师品牌的意大利精品买手店
2020/01/07 全球购物
个性大学生自我评价
2013/12/04 职场文书
自荐信怎么写呢?
2013/12/09 职场文书
春游踏青活动方案
2014/08/14 职场文书
2014年环保工作总结
2014/11/26 职场文书
2014年保卫科工作总结
2014/12/05 职场文书
大学生学生会工作总结2015
2015/05/26 职场文书
升职自荐书
2019/05/09 职场文书
解决Django transaction进行事务管理踩过的坑
2021/04/24 Python