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 02 Javascript
jquery showModelDialog的使用方法示例详解
Nov 19 Javascript
jQuery调用Webservice传递json数组的方法
Aug 06 Javascript
JS与jQuery实现子窗口获取父窗口元素值的方法
Apr 17 jQuery
详解微信小程序 通过控制CSS实现view隐藏与显示
May 24 Javascript
基于input框覆盖掉数字英文的实例讲解
Jul 21 Javascript
vue 实现 ios 原生picker 效果及实现思路解析
Dec 06 Javascript
p5.js入门教程之平滑过渡(Easing)
Mar 16 Javascript
Angular6 用户自定义标签开发的实现方法
Jan 08 Javascript
详解vue-cli3多环境打包配置
Mar 28 Javascript
Vue实现多标签选择器
Nov 28 Javascript
Angular之jwt令牌身份验证的实现
Feb 14 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
BBS(php & mysql)完整版(一)
2006/10/09 PHP
PHP使用内置函数file_put_contents写入文件及追加内容的方法
2015/12/07 PHP
PHP基于ORM方式操作MySQL数据库实例
2017/06/21 PHP
PHP实现的获取文件mimes类型工具类示例
2018/04/08 PHP
php微信开发之音乐回复功能
2018/06/14 PHP
jQuery 动画基础教程
2008/12/25 Javascript
js函数使用技巧之 setTimeout(function(){},0)
2009/02/09 Javascript
jQuery遍历Table应用示例
2014/04/09 Javascript
jQuery动画效果相关方法实例分析
2015/12/31 Javascript
JavaScript操作select元素和option的实例代码
2016/01/29 Javascript
Bootstrap进度条组件知识详解
2016/05/01 Javascript
详解Vue-基本标签和自定义控件
2017/03/24 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
2018/03/13 Javascript
webpack v4 从dev到prd的方法
2018/04/02 Javascript
4个顶级JavaScript高级文本编辑器
2018/10/10 Javascript
浅谈发布订阅模式与观察者模式
2019/04/09 Javascript
vue中keep-alive组件的入门使用教程
2019/06/06 Javascript
微信小程序实现modal弹出框遮罩层组件(可带文本框)
2020/12/20 Javascript
[51:53]完美世界DOTA2联赛决赛日 Inki vs LBZS 第二场 11.08
2020/11/10 DOTA
Python中关于使用模块的基础知识
2015/05/24 Python
Python定义二叉树及4种遍历方法实例详解
2018/07/05 Python
Python基于OpenCV库Adaboost实现人脸识别功能详解
2018/08/25 Python
人工神经网络算法知识点总结
2019/06/11 Python
Python Django基础二之URL路由系统
2019/07/18 Python
Python执行时间的几种计算方法
2020/07/31 Python
python操作链表的示例代码
2020/09/27 Python
Python图像识别+KNN求解数独的实现
2020/11/13 Python
localStorage、sessionStorage使用总结
2017/11/17 HTML / CSS
美国瑜伽服装和装备购物网站:Mukha Yoga
2019/02/22 全球购物
单位单身证明范本
2014/01/11 职场文书
高中生活自我鉴定
2014/01/18 职场文书
工作鉴定评语
2014/05/04 职场文书
离婚财产处理协议书
2014/09/30 职场文书
乔布斯辞职信(中英文对照)
2015/05/12 职场文书
Mysql基础之常见函数
2021/04/22 MySQL
Win11查看设备管理器
2022/04/19 数码科技