JAVASCRIPT函数作用域和提前声明 分享


Posted in Javascript onAugust 22, 2013

一些语言如C、java都有块级作用域,即花括号内的每一段代码都具有各自的作用域,而且变量在声明它们的代码段之外是不可见的,但是javascript没有块级作用域。javascript使用函数作用域,即变量在声明它们的函数体以及这个函数体嵌套的任意函数体内都是有定义的,也即函数内声明的所有变量在函数体内始终是可见的。这样就意味着变量在声明之前就可以使用,这个特性被称为"声明提前",即javascript函数里声明的所有变量都被提前至函数的顶部。来看个例子。

var test1 = "globalVariable";

function test(){


console.log(test1);



var test1 = "localVariable";


console.log(test1);

}

上述函数执行的结果是:先输出"undefined",再输出"localVariable"。
很多人都会误以为结果是:先输出"globalVariable,再输出localVariable"。其实不然,由于函数作用域的特性,局部变量在整个函数体始终是有定义的,也即,在函数体内局部变量遮盖了同名全局变量,但是只有在程序执行到var语句的时候,局部变量才会被真正的赋值。因此,上述过程相当于,将函数内的变量声明提前至函数体顶部,同时变量初始化留在原来的位置。就相当于如下这个函数
var test1 = "globalVariable";

function test(){


var test1;
//将函数内的变量声明提前至函数顶部


console.log(test1);



test1 = "localVariable";
//赋值


console.log(test1);

}

但是,如果函数内没有用var声明变量,情况又有所不同。
var test1 = "globalVariable";

function test(){


console.log(test1);



test1 = "localVariable";



console.log(test1);


}

这个函数执行的结果是:先输出"globalVariable",再输出"localVariable"。
由于函数体内的test1变量没有用var声明,就默认为全局变量,当然就不存在变量提前声明的问题。第一行就会输出"globalVariable",而第三行改变了test1全局变量的值,输出了"localVariable"。
Javascript 相关文章推荐
javascript 设置文本框中焦点的位置
Nov 20 Javascript
js创建对象的几种常用方式小结(推荐)
Oct 24 Javascript
js之事件冒泡和事件捕获详细介绍
Oct 28 Javascript
javascript中文本框中输入法切换的问题
Dec 10 Javascript
同域jQuery(跨)iframe操作DOM(实例讲解)
Dec 19 Javascript
js使用递归解析xml
Dec 12 Javascript
node.js中的http.createServer方法使用说明
Dec 14 Javascript
jquery实现图片左右切换的方法
May 07 Javascript
浅谈JS的基础类型与引用类型
Sep 13 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
Jul 10 Javascript
JS实现匀加速与匀减速运动的方法示例
Sep 04 Javascript
js装饰设计模式学习心得
Feb 17 Javascript
JavaScript中的eval()函数详解
Aug 22 #Javascript
from 表单提交返回值用post或者是get方法实现
Aug 21 #Javascript
jquery重新播放css动画所遇问题解决
Aug 21 #Javascript
JS性能优化笔记搜索整理
Aug 21 #Javascript
JS检测图片大小的实例
Aug 21 #Javascript
html5的自定义data-*属性和jquery的data()方法的使用示例
Aug 21 #Javascript
JavaScript 中的日期和时间及表示标准介绍
Aug 21 #Javascript
You might like
后宫无数却洁身自好的男主,唐三只爱小舞
2020/03/02 国漫
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
php时间计算相关问题小结
2016/05/09 PHP
Zend Framework数据库操作方法实例总结
2016/12/11 PHP
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
php删除数组指定元素实现代码
2017/05/03 PHP
PHP钩子与简单分发方式实例分析
2017/09/04 PHP
解决php写入数据库乱码的问题
2019/09/17 PHP
TP5框架实现上传多张图片的方法分析
2020/03/29 PHP
[推荐]javascript 面向对象技术基础教程
2009/03/03 Javascript
javascript通过className来获取元素的简单示例代码
2014/01/10 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
2015/08/24 Javascript
js动态添加的DIV中的onclick事件简单实例
2016/07/25 Javascript
JS仿QQ好友列表展开、收缩功能(第二篇)
2017/07/07 Javascript
浅谈Angular 中何时取消订阅
2017/11/22 Javascript
Egg.js 中 AJax 上传文件获取参数的方法
2018/10/10 Javascript
vue+高德地图写地图选址组件的方法
2019/05/18 Javascript
微信小程序拼接图片链接无底洞深入探究
2019/09/03 Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
2019/09/24 Javascript
Vue作用域插槽实现方法及作用详解
2020/07/08 Javascript
vue+iview实现分页及查询功能
2020/11/17 Vue.js
在Python中使用poplib模块收取邮件的教程
2015/04/29 Python
Python中的列表生成式与生成器学习教程
2016/03/13 Python
Python爬虫JSON及JSONPath运行原理详解
2020/06/04 Python
Python使用20行代码实现微信聊天机器人
2020/06/05 Python
使用pandas读取表格数据并进行单行数据拼接的详细教程
2021/03/03 Python
韩国流行时尚女装网站:Dintchina(中文)
2018/07/19 全球购物
JSP和Servlet有哪些相同点和不同点,他们之间的联系是什么?
2015/10/22 面试题
决定成败的关键——创业计划书
2014/01/24 职场文书
感恩节红领巾广播稿
2014/02/11 职场文书
测试工程师程序员求职信范文
2014/02/20 职场文书
高中校园广播稿3篇
2014/09/29 职场文书
高校自主招生教师推荐信
2015/03/23 职场文书
2016年度师德标兵先进事迹材料
2016/02/26 职场文书
2019自荐信范文集锦!
2019/07/03 职场文书
Anaconda配置各版本Pytorch的实现
2021/08/07 Python