es6从入门到放弃之let，const，块级作用域

博主之所以写这篇文章，一来是因为es6教程过于难懂，二来是为了巩固es6方面的知识。

前言:

es6和js是什么暧昧关系？JavaScript 的创造者 Netscape 公司，决定将 JavaScript 提交给国际标准化组织ECMA，希望这种语言能够成为国际标准。ECMAScript
和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 Jscript 和 ActionScript）。当然了，这是es6文本教程的说法，简单来讲，es6就是一种国际脚本语言规范，因为它针对js设定，所以它变成了js的一部分。

1.如何使用es6

（1）babel babeljs.io在线编译：

首先配置babelrc文件，可以使用

$ npm install --save-dev babel-preset-latest

   or全局安装

$ npm install --global babel-cli

or在工程中安装依赖是安装

$ npm install --save-dev babel-cli

这方面的内容太多了，建议大家去看http://es6.ruanyifeng.com/#docs/intro*（本文参考文本），加深理解

（2）traceur编译

traceur是google出的一款浏览器，可以把es6编译成es5，使用的时候要加上bootstrap.js引导程序，用法如下

<script src="treaceur.js"></script>
<script src="bootstrap.js"></scrip[t>
<script type="module">

</script>

2.es6新增的let命令，用来声明变量。用let生命的变量有自己的作用域，只在代码块内有效。下面来看看es6教程中的例子：

{
let a = 10;
var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

因为let只在自己的作用域的代码块内生效，所以在外部调用它时会输出undefined，这样做显然是有好处的，下面我们再来看下一个例子：

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

上面代码中，变量

i

是

var

命令声明的，在全局范围内都有效，所以全局只有一个变量

i

。每一次循环，变量

i

的值都会发生改变，而循环内被赋给数组

a

的函数内部的

console.log(i)

，里面的

i

指向的就是全局的

i

。也就是说，所有数组

a

的成员里面的

i

，指向的都是同一个

i

，导致运行时输出的是最后一轮的

i

的值，也就是10。

如果使用

let

，声明的变量仅在块级作用域内有效，最后输出的是6。

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

上面代码中，变量

i

是

let

声明的，当前的

i

只在本轮循环有效，所以每一次循环的

i

其实都是一个新的变量，所以最后输出的是

6

。你可能会问，如果每一轮循环的变量

i

都是重新声明的，那它怎么知道上一轮循环的值，从而计算出本轮循环的值？这是因为
JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量

i

时，就在上一轮循环的基础上进行计算。
另外，

for

循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域。

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

上面代码正确运行，输出了3次

abc

。这表明函数内部的变量

i

与循环变量

i

不在同一个作用域，有各自单独的作用域。

如果大家使用过c++或者java，就会发现这个let跟里面的声明变量的关键字如此相似，功能基本是一样的。

另外，let不存在变量声明提升，会出现暂时性死区，也不允许重复声明。

2.const

const是es6新增的一个声明常量的命令。所谓常量，就是不可变的变量。但是这个不可变的并不是值，而是这个常量指向的内存地址。我们可以为这个常量添加新属性，数组成员等，但是不可以改变它的指向。这个和c++的const其实是一个道理。

另外，const一旦声明必须赋值，否则就会出现错误。

const

的作用域与

let

命令相同：只在声明所在的块级作用域内有效；

const

命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用；

const

声明的常量，也与

let

一样不可重复声明。

3.块级作用域

函数能不能在块级作用域之中声明？这是一个相当令人混淆的问题。

在es5中，在块级作用域声明函数是违法的。但是浏览器并不遵从这个规定；

所以，es6为了兼容以前的代码，允许在块级作用域声明函数，只是这个函数只能在块级作用域中调用。

ES6 声明变量的六种方法 

ES5 只有两种声明变量的方法：

var

命令和

function

命令。ES6
除了添加

let

和

const

命令，后面章节还会提到，另外两种声明变量的方法：

import

命令和

class

命令。所以，ES6
一共有6种声明变量的方法。