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 相关文章推荐
重定向实现代码
Nov 20 Javascript
jquery判断单个复选框是否被选中的代码
Sep 03 Javascript
js FLASH幻灯片字符串中有连接符&的处理方法
Mar 01 Javascript
jQuery ReferenceError: $ is not defined 错误的处理办法
May 10 Javascript
jquery超简单实现手风琴效果的方法
Jun 05 Javascript
在JavaScript中处理时间之getHours()方法的使用
Jun 10 Javascript
基于javascript制作经典传统的拼图游戏
Mar 22 Javascript
微信小程序 检查接口状态实例详解
Jun 23 Javascript
使用Sonarqube扫描Javascript代码的示例
Dec 26 Javascript
基于mpvue小程序使用echarts画折线图的方法示例
Apr 24 Javascript
使用JS location实现搜索框历史记录功能
Dec 23 Javascript
基于node+websocket+html实现腾讯课堂聊天室聊天功能
Mar 04 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 杂谈《重构-改善既有代码的设计》之四 简化条件表达式
2012/04/09 PHP
使用PHP获取汉字的拼音(全部与首字母)
2013/06/27 PHP
在PHP上显示JFreechart画的统计图方法
2013/11/03 PHP
cakephp常见知识点汇总
2017/02/24 PHP
yii2简单使用less代替css示例
2017/03/10 PHP
php strftime函数的详细用法
2018/06/21 PHP
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
2010/10/18 Javascript
jQuery extend 的简单实例
2013/09/18 Javascript
jquery如何实现锚点链接之间的平滑滚动
2013/12/02 Javascript
js中arguments,caller,callee,apply的用法小结
2014/01/28 Javascript
JavaScript 变量、作用域及内存
2015/04/08 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
2015/09/02 Javascript
JS右下角广告窗口代码(可收缩、展开及关闭)
2015/09/04 Javascript
简单谈谈node.js 版本控制 nvm和 n
2015/10/15 Javascript
javascript常用函数(2)
2015/11/05 Javascript
详解javascript实现自定义事件
2016/01/19 Javascript
在angular 6中使用 less 的实例代码
2018/05/13 Javascript
微信小程序HTTP接口请求封装的实现
2019/02/21 Javascript
详解Js里的for…in和for…of的用法
2019/03/28 Javascript
VUE 组件转换为微信小程序组件的方法
2019/11/06 Javascript
微信小程序后端(java)开发流程的详细步骤
2019/11/13 Javascript
JavaScript实现京东放大镜效果
2019/12/03 Javascript
js实现二级联动简单实例
2020/01/11 Javascript
微信小程序地图实现展示线路
2020/07/29 Javascript
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
python删除文件示例分享
2014/01/28 Python
python中使用enumerate函数遍历元素实例
2014/06/16 Python
python数据类型_字符串常用操作(详解)
2017/05/30 Python
Python values()与itervalues()的用法详解
2019/11/27 Python
增大python字体的方法步骤
2020/07/05 Python
摩托车和ATV零件、配件和服装的首选在线零售商:MotoSport
2017/12/22 全球购物
KENZO官网:高田贤三在法国创立的品牌
2019/05/16 全球购物
爱护花草树木的标语
2014/06/11 职场文书
水利水电建筑施工应届生求职信
2014/07/04 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
我的中国梦演讲稿500字
2014/08/19 职场文书