JS中的let和const命令

前言

在js30中看到的let和const两种声明变量的方法，记录一下二者的基本概念

参考阮一峰的：let 和 const 命令

在ES6之前，Js只有两种作用域：全局变量和函数内局部变量

ES6中引入了两个关键字：let、const

1 let命令

1.1 块级作用域

首先它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。

• 使用 var 关键字声明的变量不具备块级作用域的特性，它在 {} 外依然能被访问到。
• let 声明的变量只在 let 命令所在的代码块 {} 内有效，在 {} 之外不能访问。

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

块级作用域可以解决很多问题，例如：

• 内层变量覆盖外层
• 循环变量用完后泄露为全局变量

ES6允许块级作用域的嵌套，只要使用{}括起来，外层无法读取内层的变量（C++函数体范围概念类似）

块级作用域也使得匿名立即执行函数表达式（匿名 IIFE）不再必要了。

// IIFE 写法
(function () {
  var tmp = ...;
  ...
}());
// 块级作用域写法
{
  let tmp = ...;
  ...
}

1.2 循环作用域

使用了 var 关键字，它声明的变量是全局的，包括循环体内与循环体外，而循环内被赋给数组a的函数内部的console.log(i)，里面的i指向的就是全局的i。也就是说，所有数组a的成员里面的i，指向的都是同一个i，所以全局只有一个变量i，每次循环改变的是i的值。

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

使用 let 关键字，它声明的变量仅在块级作用域有效，每次循环都是一个新的变量，每个i都是不一样的

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

注： JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算。因此本轮重新声明的值可以知道上一轮的值从而开展计算。

另：for循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域。结果成功输出3次abc，即说明循环变量的i和函数体内部的i不一样

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

1.3 变量提升问题&暂时性死区

JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。

变量提升：函数声明和变量声明总是会被解释器悄悄地被”提升”到方法体的最顶部。

• var声明的变量可以在声明前使用，值为undefined，但是按照逻辑应该是先声明后使用
• let的变量必须先声明后使用，即变量a在声明前就存在了，由于是var声明，就会先输出undefined ，而b用let声明，表示在声明前b是不存在的，若使用了就会报错。

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

console.log(b);//报错：ReferenceError
let b=1;

只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。（学过C++的还是很好理解这些概念的）

ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。

总之，在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称 TDZ）。

var a=111;
if(true){
	a="xyz";//报错
    typeof x; // ReferenceError
	let a;//在let命令声明变量tmp之前，都属于变量tmp的“死区”。
}

//或者一些隐性的死区
function cmp(x=y,y=2){
    return [x,y];
}
cmp();
//因为x默认值=y，此时y还未声明，属于死区  
//改为x=2,y=x就不会报错

1.4 全局变量和全局对象的属性

ES5中全局对象的属性与全局变量基本是等价的，但是也有区别，比如通过var声明的全局变量不能使用delete从 window/global （ global是针对与node环境）上删除，不过在变量的访问上基本等价。

ES6 中做了严格的区分，使用 var 和 function 声明的全局变量依旧作为全局对象的属性，使用 let****, const 命令声明的全局变量不属于全局对象的属性。

2 const命令

const 和 let 的作用域是一致的，不同的是 const 变量一旦被赋值，就不能再改变了，但是这并不意味着使用 const 声明的变量本身不可变，只是说它不可被再次赋值了，而且const 声明的变量必须经过初始化。即声明时就进行赋值操作，只声明不赋值会报错！

const foo;
// SyntaxError: Missing initializer in const declaration

本质

const实际上并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。对于复合类型的数据（主要是对象和数组），变量指向的是数据所在的地址，因此它保存的只是一个指向实际数据的指针，const只能保证这个地址指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构就不能控制了。因此，将一个对象声明为常量必须非常小心。

• 简单数据类型（数值，字符串，布尔值）：值保存在变量指向的那个内存地址，因此等同于常量。
• 复合类型的数据（对象和数组）：变量指向的是内存地址，保存的是一个指针，const只能保存这个指针地址是固定的，至于他指向的数据结构是不是可变的，就完全不能控制了。