JavaScript变量声明详解


Posted in Javascript onNovember 27, 2014

定义在函数体外的都属于全局变量,定义在函数体内的属于局部变量。这里的定义是指通过var声明的。

JavaScript有隐含的全局概念,意味着你不声明的任何变量都会成为一个全局对象属性。例如:

function test(){

    myname = "huming";

    alert(myname);

}

test();// "huming"

alert(myname);
//"huming"

 两个结果是一样的,说明myname是一个全局变量。

那么,隐式全局变量和明确定义的全局变量有没有区别呢。。答案肯定是有的,看下面的例子:

// 定义三个全局变量

var global_test1 = 1;

global_test2 = 2; // 反面教材

(function () {

    global_test3 = 3; // 反面教材

}());

// 试图删除

delete global_test1; // false

delete global_test2; // true

delete global_test3; // true

// 测试该删除

alert(typeof global_test1); // "number"

alert(typeof global_test2); // "undefined"

alert(typeof global_test3); // "undefined"

 由上面的例子可以看出:在函数之外通过var定义的global_test1不能被删除,而没有经过var定义的global_test2和global_test3都被删除了(无论是否是在函数体内创建)。

总结来说,在函数体外通过var声明的全局变量不能被删除,而隐式全局变量是可以删除的。

这里要注意了:JavaScript有一种行为叫做“hoisting”(悬置/置顶解析/预解析)。

我们通过一个例子来说明:

var myname = "huming"; //声明全局变量

function test() {

    alert(myname);

    var myname = "local_huming";

    alert(myname);

}

test();

 你猜两次alert的内容一致吗??显然不一致,一致还用说吗。。实际输出是:"undefined", "local_huming"。

上面的例子等同于

var myname = "huming"; //声明全局变量

function test() {
var myname;

alert(maname);<br>
myname = "local_huming";

alert(myname);    // "local"

}

test();

第一次alert输出的myname并不是你以为的全局变量,而是和它在一个作用域(一个函数体)内的局部变量。虽然它还没有被声明,但被当作是声明了。这就是所谓的“hoisting”。

这样应该就明白了吧。当你在函数体中使用了一个变量,又在之后重新声明的话,就可能产生错误。

书写规范:

function test() {

   var a = 1,

       b = 2,

       c = a + b,

       d = {},

       e,

       f;

   // function body...

}

 

好处在于:

1、所有局部变量都定义在函数开始,方便查找;

2、防止变量在定义之前使用的逻辑错误。

小伙伴们是否了解了javascript的变量声明了呢,以上内容很详细也很易懂,最后的总结也很中肯,小伙伴们不要错过。

Javascript 相关文章推荐
Mootools 1.2教程 输入过滤第二部分(字符串)
Sep 15 Javascript
跟我学习javascript的严格模式
Nov 16 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
Jan 26 Javascript
关于微信上网页图片点击全屏放大效果
Dec 19 Javascript
微信小程序上传图片到服务器实例代码
Nov 07 Javascript
JavaScript实现计算多边形质心的方法示例
Jan 31 Javascript
详解babel升级到7.X采坑总结
May 12 Javascript
详解async/await 异步应用的常用场景
May 13 Javascript
通过实例了解js函数中参数的传递
Jun 15 Javascript
深入了解Hybrid App技术的相关知识
Jul 17 Javascript
使用preload预加载页面资源时注意事项
Feb 03 Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
Aug 13 Javascript
js脚本实现数据去重
Nov 27 #Javascript
实例分析js和C#中使用正则表达式匹配a标签
Nov 26 #Javascript
javascript几个易错点记录
Nov 26 #Javascript
jquery选择器需要注意的问题
Nov 26 #Javascript
jquery操作对象数组元素方法详解
Nov 26 #Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 #Javascript
JavaScript定义类和对象的方法
Nov 26 #Javascript
You might like
无限级别菜单的实现
2006/10/09 PHP
Mysql的GROUP_CONCAT()函数使用方法
2008/03/28 PHP
php cookies中删除的一般赋值方法
2011/05/07 PHP
php 无法加载mysql的module的时候的配置的解决方案引发的思考
2012/01/27 PHP
php加密算法之实现可逆加密算法和解密分享
2014/01/21 PHP
php5.3 goto函数介绍和示例
2014/03/21 PHP
PHP常用的三种设计模式汇总
2016/08/28 PHP
PHP操作MySQL中BLOB字段的方法示例【存储文本与图片】
2017/09/15 PHP
Javascript 去除数组的重复元素
2010/05/04 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
jQuery阻止同类型事件小结
2013/04/19 Javascript
js点击更换背景颜色或图片的实例代码
2013/06/25 Javascript
jQuery function的正确书写方法
2013/08/02 Javascript
a标签的href与onclick事件的区别详解
2014/11/12 Javascript
javascript实现window.print()去除页眉页脚
2014/12/30 Javascript
jQuery 3.0十大新特性
2016/07/06 Javascript
js querySelector() 使用方法
2016/12/21 Javascript
搭建简单的nodejs http服务器详解
2017/03/09 NodeJs
详解Vue路由开启keep-alive时的注意点
2017/06/20 Javascript
Vue组件的使用教程详解
2018/01/05 Javascript
vue控制多行文字展开收起的实现示例
2019/10/11 Javascript
用Python3创建httpServer的简单方法
2018/06/04 Python
python自动发邮件总结及实例说明【推荐】
2019/05/31 Python
python数据预处理之数据标准化的几种处理方式
2019/07/17 Python
对Python3中列表乘以某一个数的示例详解
2019/07/20 Python
python闭包、深浅拷贝、垃圾回收、with语句知识点汇总
2020/03/11 Python
Python+Django+MySQL实现基于Web版的增删改查的示例代码
2020/05/13 Python
numpy矩阵数值太多不能全部显示的解决
2020/05/14 Python
python exit出错原因整理
2020/08/31 Python
HTML5新增属性data-*和js/jquery之间的交互及注意事项
2017/08/08 HTML / CSS
New Balance英国官方网站:始于1906年,百年慢跑品牌
2016/12/07 全球购物
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
golang 实现两个结构体复制字段
2021/04/28 Golang
Go语言应该什么情况使用指针
2021/07/25 Golang
python如何为list实现find方法
2022/05/30 Python