JavaScript之ES6语法
目录
1.变量的使用
（1）let的使用
（2）const的使用
2.解构赋值
(1) 数组解构
（2）对象解构
3.箭头函数
（1）箭头函数的写法
（2）箭头函数的this指向问题
4.三点运算符
（1）剩余运算符
a.传不定参或实参为数组的情形
b.数组解构
c.函数传对象
（2）扩展运算符
a.输出数组元素
b.合并数组
c.将类数组转为真正的数组：包括节点类数组、字符串
d.复制数组（相当于深拷贝）
5.数组扩展方法
(1)Array.from()
(2)array.find()或array.findIndex()
(3)array.includes()
（4）array.map()
（5）array.filter()
（6）array.reduce()
（7）array.fill()
（8）for...of
（9）for...in
（10）遍历对象
(11) forEach()
（12）in的使用
（13）array.some()
(14) array.join()
（15）Array.of()
6.字符串扩展方法
(1) 模板字符串
（2）startsWith()或endsWith()
(3)repeat()
7.对象扩展
(1)对象的简写
（2）构建属性
（3）合并对象
8.set数据结构
（1）size获取长度
（2）add添加元素
（3）delete删除元素
（4）has判断元素是否存在
（5）forEach()遍历元素
（6）clear清空元素
9.symbol对象的使用
（1）相同的赋值，变量也相同，除非使用Symbol.for()
（2）不能与运算符进行计算
本文主要介绍ES6中的一些语法。
1.变量的使用
（1）let的使用
a.提供块级作用域
b.不存在变量提升，需要先声明再使用，否则会出现“暂时性死区”
c.不能重复声明
（2）const的使用
a.定义常量，不可更改，声明时需要初始化
b.提供块级作用域
c.定义数组或对象时，可修改其中的元素或属性
2.解构赋值
(1) 数组解构
a.基本解构，一一对应
b.不需要赋值的变量，可不写，要用逗号空出位置
c.一组数可以赋值为一个数组，需要利用三点运算符
d.可为变量取默认值，若未赋值或者赋的值是undefined,会取默认值
（2）对象解构
a.基本解构，通过属性名一一赋值
b.在属性名的冒号后添加名称，可为变量重新命名
c.也可取默认值
3.箭头函数
（1）箭头函数的写法
一般的，箭头函数的基本写法为：名称()=>{}.
注意：当执行语句只有一条时，可省略大括号和return.当参数只有一个时，可省略小括号
（2）箭头函数的this指向问题
通过与普通函数的比较，介绍箭头函数的this指向。
a.全局函数下
普通函数的this指向window对象，箭头函数的this也指向window对象
b.对象中
一般而言，普通方法的this指向对象本身，箭头函数的this指向全局对象
c.构造函数中
普通方法和箭头函数中的this都指向实例化对象。要注意的是，箭头函数中的this指向不会变化。
总结：
普通函数的this，与调用者有关。
箭头函数中的this，与上下文有关，是该函数所在作用域下this指向的值。 可以简单理解为，定义箭头函数中的作用域的this指向谁，它就指向谁
下面的案例有助于你理解普通函数与箭头函数中this指向的问题。需要注意的是，当利用call改变fn的调用对象时，调用fn()的普通函数，this会指向obj对象。但是，调用其中返回出来的普通函数时，this的指向仍是window对象，并未改变。
Document
4.三点运算符
（1）剩余运算符
a.传不定参或实参为数组的情形
// 1.传不定参
function sum(a, ...num) {
let sum = a;
for (let i = 0; i < num.length; i++) {
sum += num[i];
}
return sum;
}
// 2.实参为数组
function addTwo(a, b) {
return a + b;
}
console.log(addTwo(...[1, 6]));
console.log(sum(10, 2, 3, 4));b.数组解构
let [a, ...b] = [1, 4, 5, 6];
console.log(a, b);c.函数传对象
function obj({
uname: u,
age: a
}) {
console.log(u, a)
}
obj({
uname: 'zs',
age: 16
})（2）扩展运算符
a.输出数组元素
b.合并数组
c.将类数组转为真正的数组：包括节点类数组、字符串
d.复制数组（相当于深拷贝）
let divs = document.querySelectorAll('div');
// 二、扩展运算符
// 1.输出数组
let array1 = [5, 6, 7, 8];
console.log(...array1);
//2.合并数组
let array2 = [9, 10, 11];
let array3 = [...array1, ...array2]
console.log(array3);
//3.将类数组转为真正的数组
// (1)转节点类数组
console.log(divs);
console.log([...divs]);
//（2）转字符
console.log('890');
console.log([...
'890'
]);
//(3)复制数组（深拷贝）
let array4 = [3, 6, 9];
let array5 = [...array4];
array5[0] = 190;
console.log(array4);
console.log(array5);5.数组扩展方法
(1)Array.from()
将类数组转为真正的数组
(2)array.find()或array.findIndex()
找到符合条件的第一个元素或其对应的索引
(3)array.includes()
判断数组是否包含某个元素，返回true或false
// 1.Array.from():将类数组转为真正的数组
let str = '123';
console.log(Array.from(str));
let obj = {
0: 'zs',
1: 19,
length: 3
};
console.log(Array.from(obj));
//2.arr.find():找到符合条件的第一个元素
let arra1 = [1, 5, 6, -3, 4]
console.log(arra1.find(item => item < 0));
//2.arr.findIndex():找到符合条件的第一个元素的索引
let arra2 = [1, -3, 6, 4]
console.log(arra2.findIndex(item => item < 0));
//3.arr.includes:判断数组是否包含某个元素
console.log(arra2.includes(-3));
console.log(arra2.includes(16));（4）array.map()
修改数组中的每个元素
（5）array.filter()
筛选出符合条件的所有元素
（6）array.reduce()
“累加器”的效果，total为初始值，也是返回值，c代表当前值。第二个参数可设置reduce的初始值。
（7）array.fill()
将数组元素填充为指定内容，第一个参数为指定的内容，后两个规定填充的起始位置
（8）for...of
访问数组的元素
（9）for...in
访问数组元素的下标
（10）遍历对象
a.利用for...in
b.利用Object.keys先获取属性，再利用for...of遍历
c.Object.values()获取对象属性的值
(11) forEach()
遍历数组，三个参数：分别代表数组元素、索引和整个数组
（12）in的使用
判断属性是否存在（数组判断索引，对象判断属性）
（13）array.some()
判断数组中是否有元素满足特定条件
(14) array.join()
以特定字符连接数组元素
（15）Array.of()
将一串字符转为数组
Document
6.字符串扩展方法
(1) 模板字符串
（2）startsWith()或endsWith()
判断字符串是否以特定字符开始或结束
(3)repeat()
重复字符串
7.对象扩展
(1)对象的简写
当属性名与变量名相同时，可省略变量名
（2）构建属性
利用中括号及变量名即可添加指定的属性
（3）合并对象
a.利用Object.assign(对象1，对象2，...)
b.利用三点运算符
Document