彻底弄清楚var let const的区别

| 彻底弄清楚var let const的区别已关闭评论

今天又有小伙伴问我一个这样的问题，JavaScript中，为什么有的变量用var定义，有的用let，还有的用const呢？

先给出结果如下：

常用场景

  • const 优先使用，尤其是常量、对象、数组，（占 80% 场景）
  • let 需要修改时使用，需要重新赋值的变量（如循环、条件分支），（占 20% 场景）
  • var 永远不用

首先是作用域不一样

  • var声明的变量是全局作用域或函数作用域
  • let和const声明的变量是块级作用域

重新声明 & 值更新

  • var声明的变量，可以重新声明，也可以进行更新；
  • let声明的变量，不可以再声明，但可以进行更新；
    • 重新声明会报错 Uncaught SyntaxError: Identifier 'x' has already been declared
  • const声明的变量，声明时必须初始化，既不能再次声明，也不可以进行更新；
    • 重新声明会报错 Uncaught SyntaxError: Identifier 'x' has already been declared
    • 更新值也会报错 Uncaught TypeError: Assignment to constant variable.

变量提升和TDZ（Temporal Dead Zone）

  • 从作用域开始到变量声明的位置，这段区域就是 TDZ。
  • var声明的变量，存在变量提升，变量定义不但会被提升到作用域的顶部，而且还会初始化为undefined；
  • let和const声明的变量，不存在变量提升，存在TDZ。如果在初始化之前就使用，会报错 Uncaught ReferenceError: Cannot access 'x' before initialization

没错，那个小伙伴就是我自己：）