共计 1375 个字符，预计需要花费 4 分钟才能阅读完成。

为什么使用ES6

• 变量提升特性增加了程序运行时的不可预测性
• 语法过去松散，实现相同的功能，不同的人可能会写出不同的代码

let

声明变量的关键字

• 不存在变量提升
• 块级作用域
• 暂时性死区

const

声明常量的关键字（常量就是值，内存地址不能变化的量）

• 块级作用域
• 声明常量时必须赋值
• 常量赋值后，值不能修改

var 、let、const 区别

1. 使用 var 声明的变量，其作用域为该语句所在的函数内，且存在变量提升
2. 使用 let 声明的变量，其作用域为该语句所在的代码块内，不存在变量提升
3. 使用 const 声明的是常量，在后面出现的代码中不能修改该常量的值

解构赋值

ES6中允许从数组中提取值，按照对应位置，对变量赋值；对象也可以实现解构

数组解构

    let arr = [1, 2, 3]
    let [a, b, c, d] = arr
    console.log(a) // 1
    console.log(b) // 2
    console.log(c) // 3
    console.log(d) // undefined

如果解构不成功，变量的值为 undefined

对象解构

    let obj = { name: '张三', age: 18 }
    let { name, age } = obj
    console.log(name) // 张三
    console.log(age) // 18

    let { name: myName, age: myAge } = obj // myName myAge 属于别名
    console.log(myName) // 张三
    console.log(myAge) // 18

箭头函数

    () => {}
    const fn = () => {}

函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号

    function sum(num1, num2) {
        return num1 + num2
    }
    const = sum = (num1, num2) => num1 + num2

如果形参只有一个，可以省略小括号

    function fn(num) {
        return num
    }
    const fn = num => num

箭头函数不绑定 this 关键字，箭头函数中的 this ，指向的是函数定义位置的上下文 this

    const obj = { name: '张三' }
    function fn() {
        console.log(this)
        return () => {
            console.log(this)
        }
    }
    const = resFn = fn.call(obj)
    resFn()

剩余参数

剩余参数语法允许我们将一个不定数量的参数表示为一个数组

    function sum(num1, ...args) {
        console.log(num1) // 10
        console.log(num1) // [20, 30]
    }
    sum(10, 20,30)

    const sum = (...args) => {
        let total = 0
        args.forEach( (item) => {
            total += item
        })
        return total
    }
    console.log(sum(10, 20)) // 30
    console.log(sum(10, 20, 30)) // 60

剩余参数和解构配合使用

    let uname = ['张三', '李四', '王五']
    let [uname1, ...unameN] = uname
    console.log(uname1) // 张三
    console.log(unameN) // ['李四', '王五']