ES6学习笔记（一）let和const命令

ES6作为现在前端发展中必不可少的重要的一环，可能很多人都已经掌握了，所以希望在自己学习的路上，能够得到各位前辈大神的指点

ECMAScript 6 简介

---

1、ECMAScript和JavaScript的关系
1996年11月，JavaScript的创造者Netscape公司，决定将JavaScript提交给标准化组织ECMA，希望这种语言能够成为国际标准。次年，ECMA发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言标准，并将这种语言称为ECMAScript，这个版本就是1.0版。

该标准从一开始就是针对JavaScript语言制定的，但是之所以不叫JavaScript，有两个原因。一时商标，Java是Sun公司的商标，根据授权协议，只有Netscape公司可以合法地使用JavaScript这个名字，且JavaScript本身也已经被Netscape公司注册为商标。二是想体现这门语言的制定者是ECMA，不是Netscape，这样的有利于保证这门语言的开放性和中立性。

因此，ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的其中一种实现（另外ECMAScript方言还有JScript和ActionScript）

2、ES6与ECMAScript2015的关系

ES6的第一个版本是在2015年6月发布，正式名称是《ECMAScript2015》（简称ES2015）

ES6既是一个历史名词，也是一个泛指，含义是5.1版以后的JavaScript的下一代标准，涵盖ES2015、ES2016、ES2017等等，而ES2015则是正式名称，特指该年发布的正式版本的语言标准。

let 和 const 命令

---

基本用法

let是ES6新增的命令，用于声明变量，但是不同于var，let定义的变量只能在所在的代码块中有效

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

同样都是声明变量，由于let声明的变量只在所在的代码块中有效，所以报错

for循环就很适合使用let命令

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

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

另外，for循环有一个需要注意的地方，就是在循环变量那部分是一个父作用域，而循环体内部是一个单独的子作用域

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

输出3次abc，表明函数内部变量i与循环变量i不在同一作用域，有各自单独的作用域。

不存在变量提升

var 命令会发生“变量提升”现象，即变量可以在声明之后使用，值为undefined

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

console.log(b) // ƒ b (){}
function b (){}

console.log(c) // Uncaught ReferenceError: Cannot access 'd' before initialization
    at
let c = 2;

var 声明变量a会发生变量提升，脚本开始时，变量已经存在，但是没有赋值，所以输出undefined；let 声明变量c，不会发生变量提升，所以会报错

暂时性死区

只要块级作用域内存在let命令，它所声明的变量就被“绑定”在这个区域，不受外部影响

var tmp = 123；
if(true){
  tmp = 'abc'; // Uncaught ReferenceError: Cannot access 'tmp' before initialization
  let tmp;
}

上面的代码中，虽然在全局变量定义了tmp，但是块级作用域内let又声明了一个局部变量，导致后者绑定这个块级作用域，在let声明变量之前，tmp赋值报错

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

这在语法上称为“暂时性死区”（temporal dead zone，简称TDZ）

if(true){
  tmp = 'abc';// ReferenceError
  console.log(tmp);// ReferenceError

  let tmp;
  console.log(tmp);//undefined

  tmp = '123';
  console.log(tmp) // 123
}

不允许重复声明

let不允许在相同作用域内重复声明同一个变量

//报错
function func(){
  let a = 10;
  var a =1;
}
//报错
function func(){
  let a = 10;
  let a =1;
}

块级作用域

function f1() {
  let n = 5;
  if (true) {
    let n = 10;
  console.log(n);// 10
  }
  console.log(n); // 5
}

const命令

---

基本用法

const声明一个只读的常量。一旦被声明，常量的值就不能改变

const PI = 3.1415;
PI  // 3.1415
PI = 3；
// Uncaught TypeError: Assignment to constant variable

const声明的变量不可以改变值，所以在声明的时候就要对其进行赋值，只声明不赋值会报错

const a;// Uncaught SyntaxError: Missing initializer in const declaration

同样，const的作用域和let相同：只有在所在的块级作用域中生效
同样存在“暂时性死区”
同样只能在声明之后使用

ES6 声明变量的方法

ES5 只有两种声明变量的方法：var 和 function 。ES6中除了添加let和const命令以外，还有import和class命令，所以一共是 6种声明变量方法

ECMAScript 6 入门 2.let和const命令