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 相关文章推荐
学习ExtJS table布局
Oct 08 Javascript
jQuery学习笔记 操作jQuery对象 属性处理
Sep 19 Javascript
JavaScript包装对象使用介绍
Aug 29 Javascript
AngularJS入门教程之与服务器(Ajax)交互操作示例【附完整demo源码下载】
Nov 02 Javascript
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
js模块加载方式浅析
Aug 12 Javascript
基于Vue.js 2.0实现百度搜索框效果
Dec 28 Javascript
vue购物车插件编写代码
Nov 27 Javascript
JavaScript callback回调函数用法实例分析
May 08 Javascript
angularJS1 url中携带参数的获取方法
Oct 09 Javascript
基于vue-cli搭建多模块且各模块独立打包的项目
Jun 12 Javascript
angula中使用iframe点击后不执行变更检测的问题
May 10 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
基于mysql的bbs设计(二)
2006/10/09 PHP
mysql+php分页类(已测)
2008/03/31 PHP
PHP正则提取不包含指定网址的图片地址的例子
2014/04/21 PHP
PHP中file_exists()判断中文文件名无效的解决方法
2014/11/12 PHP
jQuery 研究心得 取得属性的值
2007/11/30 Javascript
jQuery ctrl+Enter shift+Enter实现代码
2010/02/07 Javascript
Jquery ajax传递复杂参数给WebService的实现代码
2011/08/08 Javascript
jCallout 轻松实现气泡提示功能
2013/09/22 Javascript
jQuery使用animate创建动画用法实例
2015/08/07 Javascript
详解IWinter 一个路由转控制器的 Nodejs 库
2017/11/15 NodeJs
详解使用Nuxt.js快速搭建服务端渲染(SSR)应用
2019/03/13 Javascript
详解React路由传参方法汇总记录
2020/11/29 Javascript
django 自定义用户user模型的三种方法
2014/11/18 Python
python模拟鼠标拖动操作的方法
2015/03/11 Python
Python配置文件解析模块ConfigParser使用实例
2015/04/13 Python
python发送告警邮件脚本
2018/09/17 Python
Python转换时间的图文方法
2019/07/01 Python
django基于存储在前端的token用户认证解析
2019/08/06 Python
用Python画一个LinkinPark的logo代码实例
2019/09/10 Python
django haystack实现全文检索的示例代码
2020/06/24 Python
python文件及目录操作代码汇总
2020/07/08 Python
Python调用jar包方法实现过程解析
2020/08/11 Python
Python unittest discover批量执行代码实例
2020/09/08 Python
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
日本最新流行服饰网购:Nissen
2016/07/24 全球购物
美国运动鞋和运动服零售商:Footaction
2017/04/07 全球购物
英国珠宝钟表和家居礼品精品店:David Shuttle
2018/02/24 全球购物
美国棒球装备和用品商店:Baseball Savings
2018/06/09 全球购物
护士个人简历自荐信
2013/10/18 职场文书
档案检查欢迎词
2014/01/13 职场文书
《散步》教学反思
2014/03/02 职场文书
公司给客户的感谢信
2015/01/23 职场文书
暑期实践个人总结
2015/03/06 职场文书
2015年网管个人工作总结
2015/05/22 职场文书
asyncio异步编程之Task对象详解
2022/03/13 Python
MySQL的存储函数与存储过程的区别解析
2022/04/08 MySQL