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 相关文章推荐
js getBoundingClientRect() 来获取页面元素的位置
Nov 25 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 Javascript
用Jquery选择器计算table中的某一列某一行的合计
Aug 13 Javascript
js阻止事件追加的具体实现
Oct 15 Javascript
简单实现jQuery进度条轮播实例代码
Jun 20 Javascript
关于js原型的面试题讲解
Sep 25 Javascript
微信小程序 Image API实例详解
Sep 30 Javascript
JavaScript实现的冒泡排序法及统计相邻数交换次数示例
Apr 26 Javascript
webuploader分片上传的实现代码(前后端分离)
Sep 10 Javascript
layui默认选中table的CheckBox复选框方法
Sep 19 Javascript
详解JS深拷贝与浅拷贝
Aug 04 Javascript
JS Canvas接口和动画效果大全
Apr 29 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
PHP缩略图等比例无损压缩,可填充空白区域补充色
2011/06/10 PHP
thinkphp文件引用与分支结构用法实例
2014/11/26 PHP
php实现求相对时间函数
2015/06/15 PHP
使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能示例
2017/09/15 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
javascript脚本调试方法小结
2008/11/24 Javascript
在线编辑器中换行与内容自动提取
2009/04/24 Javascript
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
jquery清空表单数据示例分享
2014/02/13 Javascript
jquery的live使用注意事项
2014/02/18 Javascript
JavaScript设计模式之装饰者模式介绍
2014/12/28 Javascript
原生javascript实现图片按钮切换
2015/01/12 Javascript
JavaScript每天定时更换皮肤样式的方法
2015/07/01 Javascript
Bootstrap实现默认导航栏效果
2020/09/21 Javascript
JavaScript来实现打开链接页面的简单实例
2016/06/02 Javascript
JavaScript实现JSON合并操作示例【递归深度合并】
2018/09/07 Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
2018/11/29 Javascript
JavaScript ECMA-262-3 深入解析(二):变量对象实例详解
2020/04/25 Javascript
[51:10]VP vs VGJ.S 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
Pycharm技巧之代码跳转该如何回退
2017/07/16 Python
两个元祖T1=('a', 'b'),T2=('c', 'd')使用匿名函数将其转变成[{'a': 'c'},{'b': 'd'}]的几种方法
2019/03/05 Python
Django的models模型的具体使用
2019/07/15 Python
CSS3 filter(滤镜)实现网页灰色或者黑色模式的代码
2020/11/30 HTML / CSS
有关HTML5中背景音乐的自动播放功能
2017/10/16 HTML / CSS
欧洲最大的品牌水上运动服装和设备在线零售商:Wuituit Outlet
2018/05/05 全球购物
汉语言文学毕业生求职信
2013/10/01 职场文书
五年级科学教学反思
2014/02/05 职场文书
社区文化建设方案
2014/05/02 职场文书
入党介绍人评语
2014/05/06 职场文书
诉讼授权委托书
2014/10/15 职场文书
搞笑老公保证书
2015/02/26 职场文书
文员岗位职责范本
2015/04/16 职场文书
党员承诺书范文2015
2015/04/27 职场文书
您对思维方式了解多少?
2019/12/09 职场文书
MySQL索引失效的典型案例
2021/06/05 MySQL
关于html选择框创建占位符的问题
2021/06/09 HTML / CSS