JS-作用域链

ES6之前

• 定义变量通过var
• 没有块级作用域, 只有全局作用域和局部作用域
• 函数大括号外的都是全局作用域
• 函数大括号中的都是局部作用域

ES6之前作用域链

• 全局作用域我们又称为0级作用域
• 定义函数开启的作用域就是1级/2级/3级/…n级作用域
• JavaScript会将这些作用域链接在一起形成一个链条, 这个链条就是作用域链
• 除0级作用域以外, 当前作用域级别等于上一级+1

变量在作用域链查找规则

• 先在当前找, 找到就使用当前作用域找到的
• 如果当前作用域中没有找到, 就去上一级作用域中查找
• 以此类推直到0级为止, 如果0级作用域还没找到, 就报错

// 全局作用域 / 0级作用域
// var num = 123;
function Num() {
    // 1级作用域
    // var num = 456;
    function test() {
        // 2级作用域
        // var num = 789;
        console.log(num);
    }
    test();
}
demo();		// 没找到 报错demo is not defined

---

ES6开始

• 定义变量通过let
• 除了全局作用域、局部作用域以外, 还新增了块级作用域
• 虽然新增了块级作用域, 但是通过let定义变量并无差异(都是局部变量)

ES6作用域链

• 全局作用域我们又称之为0级作用域
• 定义函数或者代码块都会开启的作用域就是1级/2级/3级/…作用域
• JavaScript会将这些作用域链接在一起形成一个链条, 这个链条就是作用域链
• 除0级作用域以外, 当前作用域级别等于上一级+1

变量在作用域链查找规则

• 先在当前找, 找到就使用当前作用域找到的
• 如果当前作用域中没有找到, 就去上一级作用域中查找
• 以此类推直到0级为止, 如果0级作用域还没找到, 就报错

// 全局作用域 / 0级作用域
// let num = 123;
{
    // 1级作用域
    // let num = 456;
    function test() {
        // 2级作用域
        // let num = 789;
        console.log(num);	// 报错 num is not defined
    }
    test();
}