02. let & const 命令

let & const 命令

原书作者：阮一峰
原书地址：ECMAScript 6入门

• let 用法
• 块级作用域
• const 用法
• ES6 声明变量的6中方法
• 顶层对象

1. let用法

• 基本特性
  • 用于定义变量（类似于var）
  • 作用域为当前代码块（不同于var）

  {
    let a = 10;
    var b = 1;
  }
  a // ReferenceError: a is not defined.
  b // 1
  

  • 不存在变量提升（不同于var）
    • 注：在定义let变量之前，该变量不可用，称为暂时性死区（TDZ）

  // var 的情况
  console.log(foo); // 输出undefined
  var foo = 2;
  
  // let 的情况
  console.log(bar); // 报错ReferenceError
  let bar = 2;
  
  // TDZ 导致typeof不再是一个永远不报错的操作
  typeof x; // ReferenceError
  let x;
  

  • 不允许重复声明（不同于var）

  // 报错
  function func() {
    let a = 10;
    var a = 1;
  }
  
  // 报错
  function func() {
    let a = 10;
    let a = 1;
  }
  

• 合适场景
  • for循环计数器（设置循环信息为父作用域，循环体为子作用域）

  for (let i = 0; i < 3; i++) {
    let i = 'abc';
    console.log(i);
  }
  // abc
  // abc
  // abc
  

2. 块级作用域

• 引入目的
  • 防止内层变量覆盖外层变量
  • 防止计数循环变量泄露为全局变量
• 块级作用域与函数声明
  • 允许在块级作用域声明函数
  • 函数声明类似于var，即提升到全局作用域或函数作用域头部
  • 函数作用域会提升到所在块级作用域的头部

3. const用法

• 基本特性
  • 用于定义常量
  • 作用域为当前代码块
  • 不存在变量提升
  • 不允许重复声明
• 注
  • const特性和let很像，区别在于const声明常量而let声明变量
  • const保证的是所指向变量的内存地址不能改变
    • 对于对象和数组内部数据结构变换无法控制

4. ES6 声明变量的6中方法

• var
• function
• let
• const
• import
• class

5. 顶层对象

• 对象属性
  • ES6中，顶层对象属性不再与全局对象挂钩（保留var和function不变）

  var a = 1;
  // 如果在 Node 的 REPL 环境，可以写成 global.a
  // 或者采用通用方法，写成 this.a
  window.a // 1
  
  let b = 1;
  window.b // undefined
  

• 对象本身
  • ES5 顶层对象在不同环境中实现不同
    • 浏览器，顶层对象是window，其他环境不支持
    • 浏览器和Web Worker，self也指向顶层对象
    • Node中，顶层对象是global，其他环境不支持
  • this可以用于取顶层对象，但
    • 全局环境中，this返回顶层对象，Node模块和ES6模块，this返回当前模块
    • 函数里面的，当函数不以对象方法运行，则this返回顶层对象，但是在严格模式下会为undefined
  • 取顶层对象方法（勉强可用）

  // 方法一
  (typeof window !== 'undefined'
     ? window
     : (typeof process === 'object' &&
        typeof require === 'function' &&
        typeof global === 'object')
       ? global
       : this);
  
  // 方法二
  var getGlobal = function () {
    if (typeof self !== 'undefined') { return self; }
    if (typeof window !== 'undefined') { return window; }
    if (typeof global !== 'undefined') { return global; }
    throw new Error('unable to locate global object');
  };