js变量声明作用域问题

1.先来看两个题

 1 var a = 1;
 2 foo1();
 3 function foo1(){
 4     console.log(a);     //输出1
 5 };
 6 
 7 
 8 foo2();
 9 var a = 1;
10 function foo2(){
11     console.log(a);    //输出undefined
12 };

首先这两题中应该要注意的是函数声明的提升,也就是function foo1(){}会自动被提升到顶部,所以foo1()的
调用是可以的。第一个输出1是毫无疑问的!那么第二个实际上被js引擎解析为:

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

所以在foo2()被执行的时候a还没有被赋值,所以最后输出undefined.

2.再来看看下面的例题

 1 //1
 2 var a = 1;
 3 function foo(){
 4     a = 10;
 5     return;
 6 };
 7 foo();
 8 console.log(a);    //输出10
 9 
10 //2
11 var a = 1;
12 function foo(){
13     a = 10;
14     return;
15     var a = 2;
16 };
17 foo();
18 console.log(a);    //输出1
19 
20 //3
21 var a = 1;
22 function foo(){
23     a = 10;
24     return;
25     var function a(){};
26 };
27 foo();
28 console.log(a);    //输出1

第一个输出10应该没问题,里面给a设置成了全局变量。
而后两个则有所不同,在return语句后给定义了一个数字和函数。
在这里要说一下return!
return这一行分号后面或者隔行的语句都不会被执行,但可以被js引擎解析!
所以后两个会被解析为:

//2
var a = 1;
function foo(){
    var a;
    a = 10;
    return;
    a = 2;
};
foo();
console.log(a);


//3
var a = 1;
function foo(){
    var a;
    a = 10;
    return;
    a = function(){};
};
foo();
console.log(a);

看到这里大家就知道为什么会输出1.
foo(){}里面a是局部变量,而函数内部的局部变量会在函数执行完毕之后被销毁,
所以最终输出的还是最初定义的a,也就是1.


以上是本人的一点学习心得,多谢指教!

原文地址:https://www.cnblogs.com/keRee/p/5261183.html