阮一峰ES6学习笔记
ES6的开发环境搭建
建立工程目录
先建立一个项目的工程目录，并在目录下边建立两个文件夹：scr和dist
* src：书写ES6代码的文件夹，写的js程序都放在这里
* dist：利用Bable编译成ES5代码的文件夹，在HTML页面需要引入这里的js文件
编写index.html:
文件夹建立好以后，新建一个index.html文件。
需要注意的是在引入js文件时，引入的是dist目录下的文件。
<script src="./dist/index.js"></script>编写index.js
在scr目录下，新建index.js文件
let a = 1;
console.log(a);初始化项目
打开终端或命令行公积进行初始化，默认全部同意
npm init -y初始化完成后可根据自己的需求在package.json中修改初始化内容
全局安装Babel-cli
全局安装Bable的命令行
cnpm install -g babel-cli本地安装babel-preset-es2015 和 babel-cli
cnpm install --save-dev babel-preset-es2015 babel-cli安装完成后在package.json中会多出decDependencies选项
新建 .babelrc
在根目录下新建.babellrc文件，并打开录入以下代码
{
"presets":[
"es2015"
],
"plugins":[]
}建立完成后在终端输入
babel src/index.js -o dist/index.js简化转化命令
在package.json中编写script字段
{
"script":{
"build":"babel src/index.js -o dist/index.js"
}
}修改好以后 直接可在命令行使用 npm run build 来进行转化
let和const命令
1.let命令
基本用法
ES6新增的let命令，用来声明变量，类似var，但是声明的变量，只在let声明的代码块中有效
{
let a = 10;
vat b = 9;
}
console.log(a); //ReferenceError: a is not defined.
console.log(b); //9因为let的特性，在for循环中就更适合使用let命令
for (let a = 0; a < 10; a++) {
//...
}
console.log(a); //ReferenceError: a is not defined.上面的代码中a，只在for循环体内有效，在循环体外就报错。
var a = [];
for (var i = 0; i < 10; i++ ){
a[i] = function () {
console.log(i)
}
}
a[6](); //10上面的代码使用的var，最后输出的是10，变量i通过var声明，所以只有一个全局变量i.每次循环i都是改变值，而循环内被赋值给数组a的函数内部的console.log(i)，里面的i指向的就是全局i，也就是说，所有数组a的成员里面的i，指向的都是同一个i，导致运行时输出的是最后一轮的i的值，也就是10。
var a = [];
for (let i = 0 i < 10; i++){
a[i] = function(){
console.log(i);
}
}
a[6](); // 6上面代码中，变量i是let声明的，声明的变量仅在块级作用域内有效，最后输出的是6。当前的i只在本轮循环中有效，所以每次循环的i其实都是一个新的变量，所以最后输出的是6。每一次循环的变量i的值之所以会递增，这是因为JavaScript引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算的。
另外，for循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域。
for (let i = 0; i < 10; i++) {
let i = 'abc';
console.log(i)
}
// abc
// abc
// abc上面代码正确运行，输出了3次abc。这表明函数内部的变量i与循环变量i不在同一个作用域，有各自单独的作用域。
不存在变量提升
var命令会发生“变量提升”现象，即变量可以在声明之前使用，值为undefined。这种现象有点不是很合理。
为了纠正这种现象，let命令改变了语法行为，在声明之前只有就会报错。
// var 的情况
console.log(foo); //输出undefined
var foo = 2;
// let 的情况
console.log(bar); //报错
let bar = 2;暂时性死区
只要块级作用域内存在let命令，它所声明的变量就“绑定”在这个区域，不搜外面的影响。
var tem = 123;
if(true){
tem = 'abc'; //ReferenceError
let tem;
}上面代码中，存在全局变量tmp，但是块级作用域内let又声明了一个局部变量tmp，导致后者绑定这个块级作用域，所以在let声明变量前，对tmp赋值会报错。
ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。
总之，在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称 TDZ）。
if (true) {
// TDZ开始
tmp = 'abc'; // ReferenceError
console.log(tmp); // ReferenceError
let tmp; // TDZ结束
console.log(tmp); // undefined
tmp = 123;
console.log(tmp); // 123
}
typeof x; // ReferenceError
let x;
typeof undeclared_variable // "undefined"
function bar(x = y, y = 2) {
return [x, y];
}
bar(); // 报错
function bar(x = 2, y = x) {
return [x, y];
}
bar(); // [2, 2]
// 不报错
var x = x;
// 报错
let x = x;
// ReferenceError: x is not defined总之，暂时性死区的本质就是，只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，只有等到声明变量的那一行代码出现，才可以获取和使用该变量。