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.load载入页面实现局部刷新
Jan 22 Javascript
js 验证身份证信息有效性
Mar 28 Javascript
JavaScript动态改变div属性的实现方法
Jul 22 Javascript
JS封装cookie操作函数实例(设置、读取、删除)
Nov 17 Javascript
使用jQuery判断浏览器滚动条位置的方法
May 30 Javascript
AngularJs上传前预览图片的实例代码
Jan 20 Javascript
解决vue处理axios post请求传参的问题
Mar 05 Javascript
JS实现为动态创建的元素添加事件操作示例
Mar 17 Javascript
浅谈Vue内置component组件的应用场景
Mar 27 Javascript
解决微信小程序云开发中获取数据库的内容为空的方法
May 15 Javascript
ES6之Proxy的get方法详解
Oct 11 Javascript
element-ui 文件上传修改文件名的方法示例
Nov 05 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 explode()函数用法、切分字符串
2012/10/03 PHP
php 生成自动创建文件夹并上传文件的示例代码
2014/03/07 PHP
ECSHOP在PHP5.5及高版本上报错的解决方法
2015/08/31 PHP
javascript与CSS复习(三)
2010/06/29 Javascript
JavaScript打开word文档的实现代码(c#)
2012/04/16 Javascript
JS Date函数整理方便使用
2013/10/23 Javascript
用JS将搜索的关键字高亮显示实现代码
2013/11/08 Javascript
JS获取表格内指定单元格html内容的方法
2015/03/31 Javascript
纯javascript实现图片延时加载方法
2015/08/21 Javascript
js实现延时加载Flash的方法
2015/11/26 Javascript
javascript DIV实现跟随鼠标移动
2020/03/19 Javascript
阿里云ecs服务器中安装部署node.js的步骤
2016/10/08 Javascript
EsLint入门学习教程
2017/02/17 Javascript
详解Windows下安装Nodejs步骤
2017/05/18 NodeJs
JavaScript中正则表达式判断匹配规则及常用方法
2017/08/03 Javascript
利用canvas中toDataURL()将图片转为dataURL(base64)的方法详解
2017/11/20 Javascript
基于javascript 显式转换与隐式转换(详解)
2017/12/15 Javascript
JS实现基于拖拽改变物体大小的方法
2018/01/23 Javascript
基于Vue2.X的路由和钩子函数详解
2018/02/09 Javascript
利用Vue构造器创建Form组件的通用解决方法
2018/12/03 Javascript
python交互式图形编程实例(三)
2017/11/17 Python
用Python抢火车票的简单小程序实现解析
2019/08/14 Python
python实现tail实时查看服务器日志示例
2019/12/24 Python
pytorch中使用cuda扩展的实现示例
2020/02/12 Python
django 将自带的数据库sqlite3改成mysql实例
2020/07/09 Python
基于Python实现体育彩票选号器功能代码实例
2020/09/16 Python
利用CSS3实现开门效果实例源码
2016/08/22 HTML / CSS
HTML5 Canvas画线技巧——实现绘制一个像素宽的细线
2013/08/02 HTML / CSS
一家专门经营包包的英国网站:MyBag
2019/09/08 全球购物
美德好少年主要事迹
2014/01/29 职场文书
护士工作失误检讨书
2014/09/14 职场文书
2015年大学生工作总结
2015/04/21 职场文书
横空出世观后感
2015/06/09 职场文书
golang正则之命名分组方式
2021/04/25 Golang
Redis 持久化 RDB 与 AOF的执行过程
2021/11/07 Redis
Golang jwt身份认证
2022/04/20 Golang