ES6中的let和const

Posted 2021-03-05 qncsssznds

let和const是ES6新增的几种变量声明方式中的两种，本篇就来谈谈这两种声明方式有什么特点。

一、let、const和var的区别

let和const的使用方式和var没有区别。但是用let和const声明出的变量，使用规则有所不同，let和const多了一些对变量的限制：

1、let和const在同一作用域下不允许重复声明变量。

var声明的变量重复声明有效。

var a = 0;
console.log( a );// 0
var a=1;
console.log( a );// 1

但是用let或const声明的变量，无论用什么声明方式重复声明都会报错

let a = 0;
console.log( a);
var a = 1;
console.log( a );
// Uncaught SyntaxError: Identifier 'a' has already been declared

2、let和const声明的变量不会预解析（没有声明提升）。

虽然a在声明之前的值为undefined，但是不会报错

console.log( a );// undefined
var a = 1;

而用let声明的变量a，如在声明前使用会报错。

console.log( a );
let a = 1;
// Uncaught ReferenceError: Cannot access 'a' before initialization

这是因为let的声明之中多出了一个概念：
TDZ：Temporal Dead Zone，即暂时性死区。在变量声明的作用域之中，不允许在变量声明之前使用这个变量，它锁死了这个作用域声明之前的所有区域使用这个变量的权限。

3、let和const声明的变量存在块级作用域。

块级作用域：ES5中只有全局作用域和函数作用域，而ES6多了块级作用域这个概念，它规定所有的大括号{}都是作用域。
如for循环里var 声明的i，在全局作用域中可以获取。

for(var i = 0; i < 10; i++ ){}
console.log( i );// 10

for循环里let声明的i，在全局作用域中无法获取。

for(let i = 0; i < 10; i++ ){}
console.log( i );// Uncaught ReferenceError: i is not defined

因为let 声明的j的作用域只在for循环之中，这对if等语句的{}，同样效果。

二、let和const的区别

1、let声明的时候可以不赋值

let a;//undefined

const声明的时候必须赋值。

const a;//Uncaught SyntaxError: Missing initializer in const declaration. const声明中缺少初始值设定项

2、let声明的变量可以改变，const声明的变量不能被改变。

let a = 10;
a = 20;
console.log( a );// 20

const b = 10;
b = 20;
// Uncaught TypeError: Assignment to constant variable. 未捕获类型错误：分配给常量变量。

但是当const声明的变量是一个地址的时候，这个地址存放的值是可以改变的。
比如我们用const声明的是一个数组或对象，其值是可以改变的：

const b = [10, 1];
b[1] = 20;
console.log( b[1] );// 20

const obj = {};
obj.a = 10;
console.log( obj );// {a: 10}

这是值传递数据和引用传递数据的区别。