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在exlipse中设置自动提示的方法
Apr 07 Javascript
解决Extjs上传图片无法预览的解决方法
Mar 22 Javascript
javascript操作table(insertRow,deleteRow,insertCell,deleteCell方法详解)
Dec 16 Javascript
jquery实现增加删除行的方法
Feb 03 Javascript
JavaScript优化专题之Loading and Execution加载和运行
Jan 20 Javascript
基于javascript编写简单日历
May 02 Javascript
JavaScript禁止用户多次提交的两种方法
Jul 24 Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 jQuery
Vue 页面跳转不用router-link的实现代码
Apr 12 Javascript
js作用域和作用域链及预解析
Apr 11 Javascript
react中Suspense的使用详解
Sep 01 Javascript
JQuery省市联动效果实现过程详解
May 08 jQuery
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
ThinkPHP php 框架学习笔记
2009/10/30 PHP
PHP实现把MySQL数据库导出为.sql文件实例(仿PHPMyadmin导出功能)
2014/05/10 PHP
php实现与erlang的二进制通讯实例解析
2014/07/23 PHP
使用ob系列函数实现PHP网站页面静态化
2014/08/13 PHP
CI框架整合widget(页面格局)的方法
2016/05/17 PHP
php实现常见图片格式的水印和缩略图制作(面向对象)
2016/06/15 PHP
js获取键盘按键响应事件(兼容各浏览器)
2013/05/16 Javascript
从QQ网站中提取的纯JS省市区三级联动菜单
2013/12/25 Javascript
jquery改变tr背景色的示例代码
2013/12/28 Javascript
js判断上传文件类型判断FileUpload文件类型代码
2014/05/20 Javascript
jQuery 移动端artEditor富文本编辑器
2016/01/11 Javascript
详解javascript new的运行机制
2016/01/26 Javascript
浅析JavaScript中的对象类型Object
2016/05/26 Javascript
文件上传的几个示例分享【推荐】
2016/12/16 Javascript
基于Vue实现timepicker
2017/04/25 Javascript
一个有意思的鼠标点击文字特效jquery代码
2017/09/23 jQuery
vue基于mint-ui的城市选择3级联动的示例
2017/10/25 Javascript
使用vue2实现购物车和地址选配功能
2018/03/29 Javascript
Angular4 Select选择改变事件的方法
2018/10/09 Javascript
Element Input组件分析小结
2018/10/11 Javascript
React父子组件间的传值的方法
2018/11/13 Javascript
vue+element UI实现树形表格带复选框的示例代码
2019/04/16 Javascript
Python面向对象编程之继承与多态详解
2018/01/16 Python
python批量修改图片后缀的方法(png到jpg)
2018/10/25 Python
python turtle 绘制太极图的实例
2019/12/18 Python
C/C++程序员常见面试题一
2012/12/08 面试题
幼儿教师自我鉴定
2013/11/02 职场文书
给校长的建议书
2014/03/12 职场文书
财务人员担保书
2014/05/13 职场文书
党代会心得体会
2014/09/04 职场文书
教师党员个人整改措施
2014/10/27 职场文书
五好家庭事迹材料
2014/12/20 职场文书
公司财务部岗位职责
2015/04/14 职场文书
离婚案件被告代理词
2015/05/23 职场文书
MySQL Router的安装部署
2021/04/24 MySQL
idea搭建可运行Servlet的Web项目
2021/06/26 Java/Android