作用域链的理解

作用域链

1. 局部作用域：局部作用域分为函数作用域和块作用域
   • 块作用域：在 JavaScript 中使用 {} 包裹的代码称为代码块，代码块内部声明的变量外部将无法被访问：
     1. let 声明的变量会产生块作用域，var 不会产生块作用域
     2. const 声明的常量也会产生块作用域
     3. 不同代码块之间的变量无法互相访问

变量：
<script>
  {
    // age 只能在该代码块中被访问
    let age = 18;
    console.log(age); // 正常
  }
  
  // 超出了 age 的作用域
  console.log(age) // 报错
  
  let flag = true;
  if(flag) {
    // str 只能在该代码块中被访问
    let str = 'hello world!'
    console.log(str); // 正常
  }
  
  // 超出了 age 的作用域
  console.log(str); // 报错
  
  for(let t = 1; t <= 6; t++) {
    // t 只能在该代码块中被访问
    console.log(t); // 正常
  }
  
  // 超出了 t 的作用域
  console.log(t); // 报错
</script>
常量：
<script>
  // 必须要有值
  const version = '1.0.0';

  // 不能重新赋值
  // version = '1.0.1';

  // 常量值为对象类型
  const user = {
    name: '小明',
    age: 18
  }

  // 不能重新赋值
  user = {};

  // 属性和方法允许被修改
  user.name = '小小明';
  user.gender = '男';
</script>

全局作用域

1. 为 window 对象动态添加的属性默认也是全局的，不推荐！
2. 函数中未使用任何关键字声明的变量为全局变量，不推荐！！！
3. 尽可能少的声明全局变量，防止全局变量被污染

作用域链

作用域链本质上是底层的变量查找机制。
Ø 在函数被执行时，会优先查找当前函数作用域中查找变量
Ø 如果当前作用域查找不到则会依次逐级查找父级作用域直到全局作用域
总结：

1. 嵌套关系的作用域串联起来形成了作用域链
2. 相同作用域链中按着从小到大的规则查找变量
3. 子作用域能够访问父作用域，父级作用域无法访问子级作用域