JS 函数作用域及变量提升那些事!

Posted 忍冬。

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS 函数作用域及变量提升那些事!相关的知识,希望对你有一定的参考价值。

一直以来小编对js函数作用域及变量提升的理论知识,虽然看了多次,但也是一知半解~

这几天做了几道js小题,对这部分进行了从新的理解,还是有所收获的~

 

主要参考书籍:

《你不知道的javascript(上卷)》第一部分

《JavaScript高级程序设计》第四章 4.2 执行环境与作用域

 

理解要点:

1. js其实是一门编译语言,代码的执行分为两个阶段:(《你不知道的JavaScript(上卷)》)

a.编译阶段

b.执行阶段

 

2. 作用域嵌套:

在当前作用域中无法找到某个变量时,引擎就会在外层嵌套中继续查找,直到找到该变量,或是抵达最外层作用域为止。(《你不知道的JavaScript(上卷)》)

 

3. 包括变量和函数在内的所有声明都会在任何代码被执行前首先被处理。变量及函数声明的提升也是在这个阶段。

注意:(1)变量及函数声明的提升只是提升“声明”,并不会提升“赋值”,赋值是在函数执行阶段完成的。

   (2)函数表达式不能被提升。

 

4. 声明变量:使用var声明的变量会自动被添加到最近的环境中。没有使用var声明,该变量会自动被添加到全局变量中。(《JavaScript高级程序设计》)

注意:这里的没有使用var声明指的是从当前作用域向上延伸搜索,直到在全局作用域中都没有找到该变量的声明,此时该变量才会自动被添加到全局变量中。(参考上面理解要点“2”)

 

好啦,以下抛出题目,可以先试着做一下,你的答案是什么 ^_^

一.

1 var foo = 1;
2 function bar( ) {
3     foo=10;
4     return function foo() { };
5 }
6 bar( );
7 console.log(foo);

二.

1 var foo = 1;
2 function bar() {
3     foo = 10;            
4     return;
5     function foo() {};
6 }
7 bar();
8 console.log(foo);

三.

1 var a = 1;
2 function fn() {
3     console.log(a);
4     var a = 2;
5 }
6 fn();
7 console.log(a);

四.

1 var a = 1;
2 function fn(a) {
3     console.log(a);
4     var a = 2;
5 }
6 fn(a);
7 console.log(a);

 

哈哈,是不是so easy,以下是小编的理解,如果有误,还望大神指出喔 ^_^

一.

 

以上是关于JS 函数作用域及变量提升那些事!的主要内容,如果未能解决你的问题,请参考以下文章

JS 作用域及作用域链

JS 作用域及作用域链

关于JavaScript的词法作用域及变量提升的个人理解

js中变量作用域及内存

javascript函数作用域及this指向详解

javascript函数作用域及this指向详解