let const var的区别

---

theme: qklhk-chocolate

highlight: a11y-dark

小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。

本文同时参与 「掘力星计划」   ，赢取创作大礼包，挑战创作激励金

前言

• 讲讲var let const 区别

let var const

• var 声明全局变量

  • 也叫顶层变量
  • 在浏览齐环境中指的是windows
  • 在node环境中指的是global

  js // 浏览器环境下 var a = 5 console.log(window.a) // 5

  • 变量提升

  ```js console.log(b) // undefined var b = 3

  // 此处代码等同于 var b; console.log(b); b = 3 ```

  • 变量覆盖
    • 重复声明全局变量会直接覆盖

  js var a = 10; var a = 20; console.log(a) //20

  • 函数局部变量
    • 函数中var 声明的变量是局部的 js var a = 10; let fn = ()=> { var a = 20; console.log(a) }; fn() // 20 console.log(a) // 10
  • 函数全局变量
    • 函数中直接使用变量是全局的

  js var a = 10; let fn = ()=> { a = 20 } fn() console.log(a) // 20

• let 声明局部变量

  • let是ES6新增语法

  • 用于声明局部变量 只在当前作用域有效 js { let a = 1 console.log(a) // 1 } console.log(a) // ReferenceError: a is not defined.

  • 不存在变量提升

    • 变量不会提升 直接打印会抛出错误
    • 使用let 声明变量之前 变量不可用 被称为暂时性死区 js console.log(a) // ReferenceError let a = 2

  • 不受外部影响的变量

    • 只要块级作用域存在let 变量不受外部影响 js var a = 10 if(true) { a = 20; // ReferenceError let a }

  • 不能重复声明的变量

    • 同一作用域中 let不能重复声明同一变量 js let a = 10 let a = 20 // Uncaught SyntaxError: Identifier 'a' has already been declared
    • 特殊情况
      • 这种情况下是不会报错的 js let a = 10 { let a = 20 }

• const 声明常量

  • 声明一个只读常量
  • 一旦声明就不能更改
  • 初始化必须赋值 不能留到以后更改
  • const 实际保证的不是值不能改动 而是变量指向的内存地址所保存的数据不能改动 ```js const a = 10 a = 30 // TypeError: Assignment to constant variable.

  const b // yntaxError: Missing initializer in const declaration ```

  • 重复声明变量

  js let a = 30 const a = 10 //报错

  • 复杂数据类型
    • 对于复杂类型数据，变量指向的内存数据，保存的是一个实际数据的指针
    • 只能保证指针固定，不能确保变量结构不变 js const foo = {} // 添加成功 foo.prop = '123' foo.name = '番茄鸡蛋' // 报错 foo = {}

let var const 区别

• 变量提升

  • var 存在变量提升 可以在声明前调用 值为undefined

  • let const 不存在变量提升 所声明的变量都要在声明后使用 ```js // var console.log(a) // undefined var a = 10

    // let console.log(b) // Cannot access 'b' before initialization let b = 10

    // const console.log(c) // Cannot access 'c' before initialization const c = 10 ```

• 暂时性死区

  • var不存在暂时性死区
  • let const存在暂时性死区 只有到变量声明之后才可以获取和使用该变量

  ```js // var console.log(a) // undefined var a = 10

  // let
      console.log(b)  // Cannot access 'b' before initialization
      let b = 10
  
      // const
      console.log(c)  // Cannot access 'c' before initialization
      const c = 10

  ```

• 块级作用域
  • var不存在块级作用域
  • let const 存在块级作用域
• 重复声明
  • var可以重复声明变量
  • let const 不可重复声明

• 修改变量

  • var和let可以修改变量
  • const不能修改 值是只读的 并且初始要给值

    日常使用

• 大部分用let 减少用var

• 对于不需更改的值 使用const

结言

• 今日份小知识get~