es6 全称 ECMAScript 6.0，是JavaScript语言的一代标准，发布于2015年6月

1. const、let 声明块级作用域的变量

1. es5 的 var 声明变量特点

非块级作用域

if (true) {
    var a = 1
}
console.log(a); // 结果：1

变量提升

console.log(a); // 结果：undefined
var a = 1

可重复声明

var a = 1
var a = 2
console.log(a); // 结果：2

2. es6 的 let 声明变量特点

块级作用域（只在当前{}内生效）

if (true) {
    let a = 1
}
console.log(a); // 报错：Uncaught ReferenceError: a is not defined

不存在变量提升
不能重复声明

3. es6 的 const 声明变量特点（常量）

块级作用域（只在当前{}内生效）

if (true) {
    const a = 1
}
console.log(a); // 报错：Uncaught ReferenceError: a is not defined

不存在变量提升
不能重复声明

声明时必须赋值
不可再次被赋值，注意：引用类型的值在不改变引用地址的情况下，可以修改属性值
声明的变量的名称一般全大写

2. 对象、数组、字符串的解构取值

对象解构

let stu = {
    name: 'alias',
    age: 18
}
let { name, age } = stu
console.log(name, age); // 结果：alias 18

数组解构

let arr = [1, 2, 3]
let [a1, a2, a3] = arr
console.log(a1, a2, a3); // 结果：1 2 3

字符串解构

let str = 'hello world'
let [s1, s2, s3, s4, s5] = str
console.log(s1, s2); // 结果：h e

3. ES6 新增字符串方法

includes(string) 返回布尔值，判断是否包含某段字符串
startsWith(string) 返回布尔值，判断是否以某段字符串开头
endsWith(string) 返回布尔值，判断是否以某段字符串结尾
repeat(number) 返回字符串，将原字符串重复 number 次 拼接在一起
trimStart() 返回字符串，消除首位空格
trimEnd() 返回字符串，消除尾位空格
padStart(最小补全长度，用来补全的字符串) 返回字符串，字符串前补全,如果大于这个长度则补全，如果小于则无效,默认空格补全
padEnd(最小补全长度，用来补全的字符串) 返回字符串，字符串后补全,如果大于这个长度则补全，如果小于则无效,默认空格补全

4. ES6 新增数组方法

map() 返回新数组，将数组的每一项进行映射
filter() 返回新数组，返回满足条件的元素
some() 返回布尔值，任意一个元素满足条件，返回true
every() 返回布尔值，必须所有元素都满足条件，才返回true
find() 返回数组的一个元素，返回满足条件的第一个值
findIndex() 返回下标，返回满足条件的第一个值的下标
reduce() 返回计算后的值，数组累加器
includes() 返回布尔值，数组中是否包含某个值

5. 对象属性，方法简写

const name = 'es6写法，对象属性简写，在变量名和对象属性名相同的情况下，可省略属性值和冒号'
let stu = {
    name1: 'alias',
    name, // es6 对象属性简写，相当于 name: name
    play: function () {
        console.log('es5 写法');
    },
    study() {
        console.log('es6 写法，对象方法简写，去掉冒号和 function 关键字'); // es6 对象属性简写
    }
}
stu.play()
stu.study()

6. 模板字符串 ``

和es5中 '' 相比特点：可控制字符串换行，可嵌入变量、函数

    const NAME = 'alias'
    function age() {
        return 18
    }

    let es5 = NAME + '在玩羽毛球 \n'
    es5 += '她已经' + age() + '岁了'
    console.log(es5);

    let es6 = `${NAME}在玩羽毛球
她已经${age()}岁了`
    console.log(es6);

7. 拓展运算符

// 作用于字符串，可将字符串转化成数组和对象
const str = 'hello world'
console.log([...str]); // 在数组中展开，将字符串转化成数组
console.log({ ...str }); // 在对象中展开，将字符串转化成对象

// 作用于数组，可用于数组合并和数组深拷贝
let arr1 = [1, 2, 3]
let arr2 = [...arr1, 4, 5, 6]
console.log(arr2); // 结果 [1, 2, 3, 4, 5, 6]

// 作用于对象，可用于数组对象合并和对象深拷贝
// 注意：同名属性，嵌入在前不影响现有属性值，嵌入在后会覆盖原有属性值
let obj1 = { name: 'alias', age: 10 }
let obj2 = { ...obj1, name: 'AAAAA', grade: 4 }
let obj3 = { name: 'AAAAA', grade: 4, ...obj1 }
console.log(obj2); // 结果: {name: 'AAAAA', age: 10, grade: 4}  出现同名属性，嵌入在前不会覆盖现有对象属性值
console.log(obj3); // 结果: {name: 'alias', grade: 4, age: 10}  出现同名属性，嵌入在后会覆盖现有对象属性值

8. 箭头函数

箭头函数无法作为构造函数，无法绑定 this
简化普通函数，不使用 {} 可省略 return ，只有一个参数可省略 ()

// 常规写法
const mul1 = (a, b) => {
    return a + b
}
console.log(mul1(100, 99)); // 结果：199

// 单参数,无{} 写法
const mul2 = a => a + 99
console.log(mul2(100)); // 结果：199

// 无参数写法
const mul3 = () => 100 + 99
console.log(mul3(100, 99)); // 结果：199