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时间日期和毫秒的相互转换
Feb 22 Javascript
javascript读取xml实现javascript分页
Dec 13 Javascript
JavaScript基础函数整理汇总
Jan 30 Javascript
JS动态增删表格行的方法
Mar 03 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
Apr 29 Javascript
jQuery动态添加可拖动元素完整实例(附demo源码下载)
Jun 21 Javascript
node.js中的事件处理机制详解
Nov 26 Javascript
使用 Node.js 对文本内容分词和关键词抽取
May 27 Javascript
利用10行js代码实现上下滚动公告效果
Dec 08 Javascript
使用javascript函数编写简单银行取钱存钱流程
May 26 Javascript
bootstrap table合并行数据并居中对齐效果
Oct 17 Javascript
微信小程序mpvue点击按钮获取button值的方法
May 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
mysql 中InnoDB和MyISAM的区别分析小结
2008/04/15 PHP
php 魔术函数使用说明
2010/02/21 PHP
php中使用DOM类读取XML文件的实现代码
2011/12/14 PHP
php截取后台登陆密码的代码
2012/05/05 PHP
PHP实现通过二维数组键值获取一维键名操作示例
2019/10/11 PHP
浏览器无法运行JAVA脚本的解决方法
2008/01/09 Javascript
基于jquery的实现简单的表格中增加或删除下一行
2010/08/01 Javascript
基于jQuery实现的百度导航li拖放排列效果,即时更新数据库
2012/07/31 Javascript
javascript中的throttle和debounce浅析
2014/06/06 Javascript
js实现图片漂浮效果的方法
2015/03/02 Javascript
详细分析JavaScript变量类型
2015/07/08 Javascript
简单谈谈javascript中this的隐式绑定
2016/02/22 Javascript
又一枚精彩的弹幕效果jQuery实现
2016/07/25 Javascript
react.js 翻页插件实例代码
2017/01/19 Javascript
详解Jquery EasyUI tree 的异步加载(遍历指定文件夹,根据文件夹内的文件生成tree)
2017/02/11 Javascript
Node学习记录之cluster模块
2017/05/31 Javascript
Vue 应用中结合vux使用微信 jssdk的方法
2018/08/28 Javascript
让webpack+vue-cil项目不再自动打开浏览器的方法
2018/09/27 Javascript
vue返回上一页面时回到原先滚动的位置的方法
2018/12/20 Javascript
JS实现图片切换特效
2019/12/23 Javascript
Openlayers绘制聚合标注
2020/09/28 Javascript
js实现网页随机验证码
2020/10/19 Javascript
Python爬取qq music中的音乐url及批量下载
2017/03/23 Python
Python实现识别手写数字 简易图片存储管理系统
2018/01/29 Python
Python 数据处理库 pandas 入门教程基本操作
2018/04/19 Python
Linux系统(CentOS)下python2.7.10安装
2018/09/26 Python
python+selenium实现自动抢票功能实例代码
2018/11/23 Python
python基于celery实现异步任务周期任务定时任务
2019/12/30 Python
浅谈matplotlib 绘制梯度下降求解过程
2020/07/12 Python
浅谈cookie和localStorage那些事
2019/08/27 HTML / CSS
html2 canvas生成清晰的图片实现打印功能
2019/09/23 HTML / CSS
党员民主生活会材料
2014/12/15 职场文书
小学开学典礼新闻稿
2015/07/17 职场文书
学习师德师风的心得体会(2篇)
2019/10/08 职场文书
php字符串倒叙
2021/04/01 PHP
Python如何识别银行卡卡号?
2021/06/10 Python