来了解下es6新增的const和let命令

cp3_forever
196 阅读3分钟

这是我参与8月更文挑战的第9天，活动详情查看：8月更文挑战

前言

我们都知道，在es6之前，我们声明变量都是使用var命令。

es6新增了声明变量的2种命令，const和let, 今天来讲讲它们，还有和var的区别。

let命令

let命令，声明变量，这个只能在当前作用域里面访问和使用，不会变量提升（变量提升在下面会讲）。

let name = '答案cp3'
console.log(name) // 答案cp3

const命令

const命令，声明一个常量，这个常量声明之后不能再次被更改，同样也不会变量提升。

const name = '答案cp3'
console.log(name)  // 答案cp3
name = 'cp3' // 报错  Assignment to constant variable.

虽然说const声明常量不可变，但它仅仅保证的是变量在栈中的值是不可变的。

  • 所以如果你声明的变量是基本类型，那没问题，因为它们的值是存在栈中，可以保证不可变
  • 但是如果变量是引用类型，因为引用类型的值是存在堆中，栈中存的仅仅是指向堆的值的地址，堆的值是可以变的
const obj = {}
obj = {}
console.log(obj) // 报错  Assignment to constant variable.

const obj = {}
obj.name = '答案cp3'
console.log(obj) // {name: "答案cp3"}

下面来讲讲他们二者跟var的区别。

  1. var会变量提升，const和let不会变量提升。变量提升是指声明变量时，会在当前作用域的开头先声明该变量为undefined。

    console.log(name) // undefined
var name = '答案cp3'

    console.log(name) // name is not defined
let name = '答案cp3'

    var声明name，会变量提升，先声明该变量为undefined，然后再赋值答案cp3

    等同于

    var name = undefined
console.log(name) // undefined
name = '答案cp3'

    而const和let不会变量提升，在声明之前是不能使用的，语法上叫暂时性死区(temporal dead zone，tdz)。

  2. var可以重复声明，const和let不可以在同一个作用域里重复声明。

    var name = '答案'
var name = 'cp3' // 正常

let name = '答案'
let name = 'cp3' // 报错 Identifier 'name' has already been declared

const name = '答案'
const name = 'cp3' // 报错 Identifier 'name' has already been declared

    如果是在不同一个作用域下面声明，那就没问题，如下

     let name = '答案'
 if(true) {
   let name = 'cp3' // 无报错
 }

    注：因为if语句内是属于另一个块级作用域，所以不影响

  3. var在全局作用域下的声明会把变量挂载在window对象，但是let和const声明的变量不会挂载在任何对象。

    var name = '答案cp3'
cosole.log(window.name) // 答案cp3

let name1 = '答案cp3'
console.log(window.name1) //undefined

const name2 = '答案cp3'
console.log(window.name2) //undefined

总结

总结一下const和let命令：

  • const声明常量，可以保证基本类型的值不可变，不能保证引用类型的值不可变
  • let声明变量，不能在同一作用域下重复声明同一个变量，const也是如此
  • const和let不存在变量提升
  • const和let在全局作用域下的声明不会挂载到window对象

感谢你们的阅读。

avatar
文章
阅读
粉丝