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动态设置div的值下例子
Oct 29 Javascript
jquery easyui使用心得
Jul 07 Javascript
JS中处理时间之setUTCMinutes()方法的使用
Jun 12 Javascript
浅谈angularJS 作用域
Jul 05 Javascript
Javascript使用SWFUpload进行多文件上传
Nov 16 Javascript
简单谈谈Javascript函数中的arguments
Feb 09 Javascript
微信小程序实现图片上传功能实例(前端+PHP后端)
Jan 10 Javascript
详解Javascript中new()到底做了些什么?
Mar 29 Javascript
jQuery动态生成的元素绑定事件操作实例分析
May 04 jQuery
Layui 带多选框表格监听事件以及按钮自动点击写法实例
Sep 02 Javascript
浅谈vue-props的default写不写有什么区别
Aug 09 Javascript
vue-openlayers实现地图坐标弹框效果
Sep 24 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
一条久听不愿放下的DIY森海MX500,三言两语话神奇
2021/03/02 无线电
PHP的FTP学习(二)[转自奥索]
2006/10/09 PHP
PHP中实现中文字符进制转换原理分析
2011/12/06 PHP
ThinkPHP使用UTFWry地址库进行IP定位实例
2014/04/01 PHP
php数组中包含中文的排序方法
2014/06/03 PHP
使用PHPMailer发送邮件实例
2017/02/15 PHP
详解PHP使用Redis存储session时的一个Warning定位
2017/07/05 PHP
PHP的mysqli_thread_id()函数讲解
2019/01/24 PHP
php设计模式之策略模式实例分析【星际争霸游戏案例】
2020/03/26 PHP
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
javascript跨域刷新实现代码
2011/01/01 Javascript
innerHTML与jquery里的html()区别介绍
2012/10/12 Javascript
jQuery实现页面滚动时层智能浮动定位实例探讨
2013/03/29 Javascript
如何解决easyui自定义标签 datagrid edit combobox 手动输入保存不上
2015/12/26 Javascript
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
2016/01/19 Javascript
es6中的解构赋值、扩展运算符和rest参数使用详解
2017/09/28 Javascript
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
解决vue 中 echart 在子组件中只显示一次的问题
2018/08/07 Javascript
video.js 一个页面同时播放多个视频的实例代码
2018/11/27 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
2018/12/06 Javascript
详解Puppeteer前端自动化测试实践
2019/02/21 Javascript
微信小程序使用蓝牙小插件
2019/09/23 Javascript
JS数据类型判断的几种常用方法
2020/07/07 Javascript
使用Mock.js生成前端测试数据
2020/12/13 Javascript
Pyhthon中使用compileall模块编译源文件为pyc文件
2015/04/28 Python
Django自定义插件实现网站登录验证码功能
2017/04/19 Python
python3实现域名查询和whois查询功能
2018/06/21 Python
Django框架视图层URL映射与反向解析实例分析
2019/07/29 Python
python3.6生成器yield用法实例分析
2019/08/23 Python
Python基于class()实现面向对象原理详解
2020/03/26 Python
python爬虫学习笔记之pyquery模块基本用法详解
2020/04/09 Python
syb养殖创业计划书
2014/01/09 职场文书
学校消防安全制度
2014/01/30 职场文书
2015年消费者权益日活动总结
2015/02/09 职场文书
初一军训感言
2015/08/01 职场文书
二年级数学教学反思
2016/02/16 职场文书