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 相关文章推荐
为你的网站增加亮点的9款jQuery插件推荐
May 03 Javascript
jquery实现select选择框内容左右移动代码分享
Nov 21 Javascript
Express的路由详解
Dec 10 Javascript
JavaScript中Object.prototype.toString方法的原理
Feb 24 Javascript
jquery if条件语句的写法
May 19 Javascript
CSS+jQuery实现简单的折叠菜单
Dec 20 Javascript
详解A标签中href=""的几种用法
Aug 20 Javascript
打通前后端构建一个Vue+Express的开发环境
Jul 17 Javascript
ES6知识点整理之函数数组参数的默认值及其解构应用示例
Apr 17 Javascript
微信小程序实现时间进度条功能
Nov 17 Javascript
小程序如何写动态标签的实现方法
Feb 05 Javascript
es6 super关键字的理解与应用实例分析
Feb 15 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
windows下安装php的memcache模块的方法
2015/04/07 PHP
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
PHP 中TP5 Request 请求对象的实例详解
2017/07/31 PHP
php变量与字符串的增删改查操作示例
2020/05/07 PHP
关于jQuery参考实例 1.0 jQuery的哲学
2013/04/07 Javascript
js函数与php函数的区别实例浅析
2015/01/12 Javascript
jQuery实现Flash效果上下翻动的中英文导航菜单代码
2015/09/22 Javascript
jQuery搜索框效果实现代码(百度关键词联想)
2021/02/25 Javascript
深入理解React中es6创建组件this的方法
2016/08/29 Javascript
Vue.js使用v-show和v-if的注意事项
2016/12/13 Javascript
实现div内部滚动条滚动到底部和顶部的代码
2017/11/15 Javascript
基于JavaScript中字符串的match与replace方法(详解)
2017/12/04 Javascript
AngularJS实现的2048小游戏功能【附源码下载】
2018/01/03 Javascript
微信小程序swiper左右扩展各显示一半代码实例
2019/12/05 Javascript
详解vue3.0 diff算法的使用(超详细)
2020/07/01 Javascript
从零开始用webpack构建一个vue3.0项目工程的实现
2020/09/24 Javascript
python操作MongoDB基础知识
2013/11/01 Python
python中bisect模块用法实例
2014/09/25 Python
Python简单爬虫导出CSV文件的实例讲解
2018/07/06 Python
Python中使用遍历在列表中添加字典遇到的坑
2019/02/27 Python
关于python中plt.hist参数的使用详解
2019/11/28 Python
python支持多线程的爬虫实例
2019/12/21 Python
Python中包的用法及安装
2020/02/11 Python
Java多线程实现四种方式原理详解
2020/06/02 Python
python报错: 'list' object has no attribute 'shape'的解决
2020/07/15 Python
Python调用jar包方法实现过程解析
2020/08/11 Python
如何从csv文件构建Tensorflow的数据集
2020/09/21 Python
Nicole Miller官方网站:纽约女装品牌
2019/09/14 全球购物
精通CAD能手自荐书
2014/01/31 职场文书
会计学生自我鉴定
2014/02/06 职场文书
技术总监管理岗位职责
2014/03/09 职场文书
安全施工标语
2014/06/07 职场文书
公安纪律作风整顿剖析材料
2014/10/10 职场文书
一般基层干部群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
医院办公室主任岗位职责
2015/04/01 职场文书
如何利用STAR法则制作留学文书?
2019/08/26 职场文书