浅谈js变量作用域

变量的作用域也是前端面试题常考的一个问题,掌握下面几个规律可以帮你更好的理解js的作用域。

1.作用域优先级遵循就近原则,函数内部的作用域优先级大于外部

 1 var a=456;
 2 var b=111;
 3 function fn () {
 4     var a=123;
 5     a=798;
 6     console.log(a);  //输出789
 7     console.log(b);  //输出111
 8 }
 9 
10 fn();

2.变量预处理(预解析),当你写了一个变量,并且赋值,期间发生了两个过程
a.先声明一个变量,然后把声明语句放到当前作用域的最前面(此过程称为变量提升)
b.赋值语句还在原先位置,然后进行赋值。

1 function fn () {
2 
3     console.log(a);  //输出undefined
4     
5     var a=123;
6     
7 }
8 
9 fn();

以上语句相当于下面这个语句,因为a赋值在输出语句后面,没有赋值,所以值是undefined。

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

3. 如果理解了上面两点,你就会知道为什么你写了一个函数,不管在什么位置你总是能调用,而不是得到undefined
看看下面这两个函数的区别

 1 fn2();  //输出 "函数声明"
 2 fn3();  //报错(意思是函数没有定义) "Uncaught TypeError: undefined is not a function"
 3 
 4 function fn2 () {
 5     console.log("函数声明");
 6 }
 7 
 8 var fn3 = function () {
 9     console.log("函数表达式");
10 }

这就是我对js作用域的一点见解,希望可以帮助你理解。

前端发展速度之快,只有不断的学习积累,才能紧跟时代的步伐。
原文地址:https://www.cnblogs.com/zt123123/p/7600787.html