一、let 和 const

var定义变量只有全局作用域和函数作用域，let新增了块级作用域(let定义的变量不会变量提升)；const用来声明常量。

let boxs = document.querySelectorAll(".box");
for (let i = 0; i < boxs.length; i++){
    boxs[i].onclick = () => {
        console.log(i)
    }
}
//闭包写法
var boxs = document.querySelectorAll(".box");
for (var i = 0; i < boxs.length; i++){
    boxs[i].onclick = ((i)=>{
        return (e)=>{
            console.log(i)
        }
    })(i)
}

二、arrow Function(箭头函数)

箭头函数使函数写法简洁；函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象；它的this是继承外面的，因此内部的this就是外层代码块的this。

log(say){
    setTimeout( () => {
        console.log(this.state)
    }, 1000)
},
logs(){
    let self = this;
    setTimeout(function(){
        console.log(self.state)
    }, 1000)
}

三、template String(模版字符串)

用反引号" ` "来标识起始，用 ${} 来引用变量。

let str = `状态:${this.state}`;
let strs = "状态:"+this.state;

四、destructuring(解构赋值)

解构可添加默认值，使用剩余运算符，可嵌套可忽略。

//对象用法
let obj = { a: 1, b: 2, c: 3, d: 4, e: 5};
let {a, b, ...c} = obj;
console.log(a,b,c) //1 2 {c: 3, d: 4, e: 5}

let a = 1, b = 2;
let obj = {a, b}
console.log(obj.a,obj.b)//1 2

//数组用法
let arr = [1,2];
let [a, b, c = 3] = arr;
console.log(a,b,c) // 1 2 3

//交换两个变量的值
let a = 1,b = 2;
[a,b] = [b,a]；
console.log(a,b)//2 1

//嵌套用法
let obj = {a: [2, {c: 3}] };
let {a,a:[b, {c， d = 4}] } = obj;
console.log(a,b,c,d)//[2, {c: 3}] 2 3 4

五、import export(模块引用、导出)

export可输出变量、函数和类。

// e.js
export default 'Lebron';
export function work(){
    return 'player'
}
export const type = 'basketball'

import people, { work, type as games} from './e';
let job = work();
console.log(`${people} is a ${games} ${job}`)  //Lebron is a basketball player

六、class类

引入class类的概念，实现继承。

class Father{
    constructor(value){ //构造函数
        this.value = value
    }
    say(){
        console.log("我是father");
        console.log(this.value);
    }
}
class Child extends Father{
    constructor(value){
        super(value); // 调用父类的constructor(value)
    }
    say(){
        console.log("我是child");
        super.say();  // 调用父类的say()方法
    }
}