什么是作用域和作用域链？

作⽤域，即变量（变量作⽤域⼜称上下⽂）和函数⽣效（能被访问）的区域或集合

换句话说，作⽤域决定了代码区块中变量和其他资源的可⻅性

举个例⼦

function myFunction() {
 let inVariable = "函数内部变量";
}
myFunction();//要先执⾏这个函数，否则根本不知道⾥⾯是啥
console.log(inVariable); // Uncaught ReferenceError: inVariable is not defined

上述例⼦中，函数 myFunction 内部创建⼀个 inVariable 变量，当我们在全局访问这个变量的时 候，系统会报错

这就说明我们在全局是⽆法获取到（闭包除外）函数内部的变量

我们⼀般将作⽤域分成：

• 全局作用域
• 局部作用域
• 块级作用域

全局作用域：

任何不在函数中或是⼤括号中声明的变量，都是在全局作⽤域下，全局作⽤域下声明的变量可以在程序 的任意位置访问

 

/ 全局变量
var greeting = 'Hello World!';
function greet() {
 console.log(greeting);
}
// 打印 'Hello World!'
greet();

函数作⽤域：

函数作⽤域也叫局部作⽤域，如果⼀个变量是在函数内部声明的它就在⼀个函数作⽤域下⾯。这些变量 只能在函数内部访问，不能在函数以外去访问

function greet() {
 var greeting = 'Hello World!';
 console.log(greeting);
}
// 打印 'Hello World!'
greet();
// 报错： Uncaught ReferenceError: greeting is not defined
console.log(greeting);

可⻅上述代码中在函数内部声明的变量或函数，在函数外部是⽆法访问的，这说明在函数内部定义的变 量或者⽅法只是函数作⽤域

块级作⽤域：

ES6引⼊了 let 和 const 关键字,和 var 关键字不同，在⼤括号中使⽤ let 和 const 声明的变量存 在于块级作⽤域中。在⼤括号之外不能访问这些变量

 {
// 块级作⽤域中的变量
 let greeting = 'Hello World!';
 var lang = 'English';
 console.log(greeting); // Prints 'Hello World!'
}
// 变量 'English'
console.log(lang);
// 报错：Uncaught ReferenceError: greeting is not defined
console.log(greeting);

词法作⽤域

词法作⽤域，⼜叫静态作⽤域，变量被创建时就确定好了，⽽⾮执⾏阶段确定的。也就是说我们写好代 码时它的作⽤域就确定了， JavaScript 遵循的就是词法作⽤域

var a = 2;
function foo(){
 console.log(a)
}
function bar(){
 var a = 3;
 foo();
}
n()

上述代码改变成⼀张图

 由于 JavaScript 遵循词法作⽤域，相同层级的 foo 和 bar 就没有办法访问到彼此块作⽤域中的 变量，所以输出2

作⽤域链：

当在 Javascript 中使⽤⼀个变量的时候，⾸先 Javascript 引擎会尝试在当前作⽤域下去寻找该变 量，如果没找到，再到它的上层作⽤域寻找，以此类推直到找到该变量或是已经到了全局作⽤域

如果在全局作⽤域⾥仍然找不到该变量，它就会在全局范围内隐式声明该变量(⾮严格模式下)或是直接 报错

这⾥拿⼀张图解释： 把作⽤域⽐喻成⼀个建筑，这份建筑代表程序中的嵌套作⽤域链，第⼀层代表当前的执⾏作⽤域，顶层 代表全局作⽤域

 变量的引⽤会顺着当前楼层进⾏查找，如果找不到，则会往上⼀层找，⼀旦到达顶层，查找的过程都会 停⽌

下⾯代码演示下：

var sex = '男';
function person() {
 var name = '张三';
 function student() {
 var age = 18;
 console.log(name); // 张三
 console.log(sex); // 男
 }
 student();
 console.log(age); // Uncaught ReferenceError: age is not defined
}
person()

上述代码主要主要做了以下⼯作：

• student 函数内部属于最内层作⽤域，找不到 name ，向上⼀层作⽤域 person 函数内部找， 找到了输出“张三”
• student 内部输出cat时找不到，向上⼀层作⽤域 person 函数找，还找不到继续向上⼀层找， 即全局作⽤域，找到了输出“男”
• 在 person 函数内部输出 age 时找不到，向上⼀层作⽤域找，即全局作⽤域，还是找不到则报错