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 相关文章推荐
jquery使用jquery.zclip插件复制对象的实例教程
Dec 04 Javascript
简单的JavaScript互斥锁分享
Feb 02 Javascript
Bootstrap Modal对话框如何在关闭时触发事件
Dec 02 Javascript
angular分页指令操作
Jan 09 Javascript
实现一个简单的vue无限加载指令方法
Jan 10 Javascript
微信小程序手势操作之单触摸点与多触摸点
Mar 10 Javascript
分享19个JavaScript 有用的简写写法
Jul 07 Javascript
vue组件开发之用户无限添加自定义填写表单的方法
Aug 28 Javascript
vue实现循环切换动画
Oct 17 Javascript
深入理解 JS 垃圾回收
Jun 03 Javascript
如何解决日期函数new Date()浏览器兼容性问题
Sep 11 Javascript
swiper实现异形轮播效果
Nov 28 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
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
PHP获取一段文本显示点阵宽度和高度的方法
2015/03/12 PHP
PHP基于SimpleXML生成和解析xml的方法示例
2017/07/17 PHP
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
2009/05/21 Javascript
js post方式传递提交的实现代码
2010/05/31 Javascript
javascript 进阶篇2 CSS XML学习
2012/03/14 Javascript
JavaScript计算字符串中每个字符出现次数的小例子
2013/07/02 Javascript
JS实现很酷的EMAIL地址添加功能实例
2015/02/28 Javascript
js实现温度计时间样式代码分享
2015/08/21 Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
2016/11/26 Javascript
JavaScript实现多栏目切换效果
2016/12/12 Javascript
jQuery+PHP+Mysql实现抽奖程序
2020/04/12 jQuery
vue2.0 中#$emit,$on的使用详解
2017/06/07 Javascript
详解Vue整合axios的实例代码
2017/06/21 Javascript
BootstrapTable加载按钮功能实例代码详解
2017/09/22 Javascript
详谈commonjs模块与es6模块的区别
2017/10/18 Javascript
jQuery实现轮播图及其原理详解
2020/04/12 jQuery
vue中接口域名配置为全局变量的实现方法
2018/09/20 Javascript
vue-cli中vue本地实现跨域调试接口
2019/01/16 Javascript
解决vue语法会有延迟加载显现{{xxx}}的问题
2019/11/14 Javascript
原生js实现的观察者和订阅者模式简单示例
2020/04/18 Javascript
Nuxt.js 静态资源和打包的操作
2020/11/06 Javascript
python 示例分享---逻辑推理编程解决八皇后
2014/07/20 Python
python中字符串类型json操作的注意事项
2017/05/02 Python
python求解数组中两个字符串的最小距离
2018/09/27 Python
对python列表里的字典元素去重方法详解
2019/01/21 Python
python怎么判断素数
2020/07/01 Python
python实现将中文日期转换为数字日期
2020/07/14 Python
Python requests上传文件实现步骤
2020/09/15 Python
Python远程linux执行命令实现
2020/11/11 Python
用python对oracle进行简单性能测试
2020/12/05 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
公司经理任命书
2014/06/05 职场文书
学校火灾防控方案
2014/06/09 职场文书
对外汉语专业大学生职业生涯规划范文
2014/09/13 职场文书
运动会加油稿
2015/07/22 职场文书