简述

• ES6 是 2015 年发行的新的 js 标准，又名：ECMACScript 2015 标准
• 部分低版本浏览器不支持 ES6 的直接解析
• 通过 babel 可以将 ES6 代码转换为 ES5 实现所有浏览器的支持
• ES6 提升编程效率以及代码的简洁度

浏览器兼容解决方案

• chrome 浏览器 版本号 62+完全支持 ES6 (import export)
• ES6 通过 babel 进行转换: http://babeljs.io/repl/

let & const 与 var 的区别

变量声明 var

• 通过 var 声明的变量会直接声明到全局(window)作用域 上

for (var i = 0; i < 3; i++) {
  console.log(i);
}
console.log(i);
console.log(window.i);
0
1
2
3
3

• 问题：var 声明的变量如果想实现局部作用域只能通过函数作用域来实现

//这里的变量i 仍然是作为了全局变量在使用
(function() {
  for (var i = 0; i < 3; i++) {
    console.log(i);
  }
})();
console.log(i);
console.log(window.i);
0
1
2
i is not defined

• 示例 异步打印出每次循环的键值(如果不使用匿名函数传递i的参数会输出3次：3)

for (var i = 0; i < 3; i++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, 1000);
  })(i);
}
0
1
2

let 实现局部作用域

• let 和 { } 配合可以产生一个新的作用域

for (let i = 0; i < 3; i++) {
    setTimeout(function () {
        console.log(i)
    }, 1000)
}
0 
1
2

var 进行了变量提升

通过var声明的变量会自动将声明语句默认提升到最前面进行执行，但是对于读代码和理解程序的自上而下运行的流程不太好，同时也会造成变量的全局污染。

console.log(a);
var a = 1;
console.log(a);
// unidefined
// 1
console.log(a);
let a = 1;
console.log(a);
// a is not defined

暂存死区

如果当前作用域内有定义这个变量就不会向上查找，如果没有定义会自动向上查找这个变量的值

let a =1;
{
    console.log(a)
}
// 1
//暂存死区
let a =1;
{
    console.log(a);
    let a = 2;
}
// Cannot access 'a' before initialization

const 变量声明

const 拥有let 所有的特性，唯一的区别就是const声明的变量不可被修改引用空间

const b =1;
const b =2;
console.log(b);
// Identifier 'b' has already been declared
const children = {age:12};
children.age = 5;
children.sex = '女';
console.log(children);
// {age: 5, sex: "女"}