ECMAScript

1 概述

ECMA是一个组织，制定了一些标准，然后JS去实现这些标准。

ES2015兼容性：IE10+、Chrome、FireFox、移动端、NodeJS

由于兼容性问题，对于一些版本较低的设备，就需要使用一些方法使得ES6的代码可以运行起来

1、浏览器打开页面时，对ES6代码进行转换。

2、先将ES6代码编译为可以被低版本设备接收的代码，再拿去执行。

2 let/const和块级作用域

之前的JS中只有var可以声明变量，但是var存在一些问题：

1. 可以重复声明 =》混乱
2. 无法限制修改 =》 想要声明常量全凭自觉
3. 没有块级作用域（只有函数作用域）

对于第3个问题，下面举一个例子说明

function func(){
    var arr = []
    for(var i = 1; i <= 3; i++){
        arr.push(function (){
            return i*i;
        });
    }
    
    return arr;
}

var resluts = func()
var f1 = results[0];
var f2 = resluts[1];
var f3 = resluts[2];

f1(); // 16
f2(); // 16
f3(); // 16

这个现象就是由于var没有块级作用域引起的。由于函数内部都引用了变量i，但是函数并不是立刻执行的，等到results[0]需要返回的时候，i已经变成3了，所以都输出了9。

一种解决方法是使用闭包来解决，创建一个匿名函数并立刻执行。

function func(){
    var arr = []
    for(var i = 1; i <= 3; i++){
        arr.push( 
            (function(n){
                return function(){
                    return n * n;
                }
            })(i)
                );
    }
    
    return arr;
}

var resluts = func()
var f1 = results[0];
var f2 = resluts[1];
var f3 = resluts[2];

f1(); // 1
f2(); // 4
f3(); // 9

ES6引入let和const关键字，可以有效解决上面三个问题。

1. 使用let和const声明变量，不能重复声明
2. const声明常量，不能修改
3. let和const都是块级作用域，要解决上面的问题，只要将for(var i...)改成for(let i...)即可。

3 解构赋值

解构赋值是对赋值操作符的扩展，从字面意思上理解，就是把复杂对象拆分开给其他变量赋值。

let [a, b, c] = [1, 2, 3]; // a=1, b=2, c=3
let [a, ...b] = [1, 2, 3]; // a=1, b=[2,3]

let {x, y, z} = {x:"x", y:"y", z:"z"}; // x="x", y="y", z="z"