一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第22天，点击查看活动详情。
扩展运算符的应用
可以通过ES6扩展元素符...，将一个数组转为用逗号分隔的参数序列，可以搭配Set进行数组去重很方便
console.log(...[1,2,3,3,2,1])
// 1 2 3 3 2 1
console.log(1,2,...[1,2,3])
// 1 2 1 2 3
[...document.querySelectorAll('div')]
// [<div>, <div>, <div>]
还可以用于函数调用的时候，将一个数组变为参数序列
function add(x, y) {
return x + y;
}
const numbers = [4, 38];
add(...numbers) // 42
可以更简单实现数组复制(浅拷贝)
const arr = [6,6,6]
const arr1 = [...arr]
console.log(arr1)// [6,6,6]
可以将字符串转为真正的数组
console.log([...'hello'])
// ['h', 'e', 'l', 'l', 'o']
定义了遍历器（Iterator）接口的对象，都可以用扩展运算符转为真正的数组
let nodeList = document.querySelectorAll('div');
let array = [...nodeList];
let map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]) ;
let arr = [...map.keys()]; // [1, 2, 3]
如果对没有 Iterator 接口的对象，使用扩展运算符，将会直接报错
const obj = { a: 1, b: 2 }
let arr = [...obj] // Uncaught TypeError: obj is not iterable
构造函数新增的方法
Array.from()
将两类对象转为真正的数组：类似数组的对象和可遍历（iterable）的对象（包括 ES6 新增的数据结构 Set 和 Map）
let obj = {
'0': 'a',
'1': 'b',
'2': 'c',
length: 3
}
const arr5 = Array.from(obj)
console.log(arr5) // ['a', 'b', 'c']
还可以接受第二个参数，用来对每个元素进行处理，将处理后的值放入返回的数组
const arr6 = Array.from([1, 2, 3], x => x * x)
console.log(arr6)
// [1, 4, 9]
Array.of()
用于将一组值，转换为数组
const arr7 = Array.of(3, 11, 8)
console.log(arr7)
// [3,11,8]
没有参数的时候，返回一个空数组
const arr8 = Array() // []
当参数只有一个的时候，实际上是指定数组的长度
const a = Array(3)
console.log(a) // [empty × 3]
参数个数不少于 2 个时，Array()才会返回由参数组成的新数组
const arr7 = Array.of(3, 11, 8)
console.log(arr7)
// [3,11,8]
实例对象新增的方法
copyWithin()
将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组
-
target（必需）：从该位置开始替换数据。如果为负值，表示倒数。
-
start（可选）：从该位置开始读取数据，默认为 0。如果为负值，表示从末尾开始计算。
-
end（可选）：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示从末尾开始计算。
const arr9 = [1, 2, 3, 4, 5] const arr10 = arr9.copyWithin(0, 3) // 将从下表为3直到数组结束的成员（4 和 5），复制到下表为0开始的位置，结果覆盖了原来的 1 和 2 console.log(arr10) // [4, 5, 3, 4, 5]
find()、findIndex()
find()用于找出第一个符合条件的数组成员
参数是一个回调函数，接受三个参数依次为每一项、下表和原数组
[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
})
// 10
findIndex返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1
[1, 5, 10, 15].findIndex(function(value, index, arr) {
return value > 9;
}) // 2
这两个方法都可以接受第二个参数为函数，用来绑定回调函数的this对象。
function f(v){
return v > this.age;
}
let person = {name: 'John', age: 20};
[10, 12, 26, 15].find(f, person); // 26
fill() 使用给定值，填充一个数组
const arr11 = ['a', 'b', 'c'].fill(7)
console.log(arr11)
// [7, 7, 7]
还可以配合构造函数使用
const arr12 = new Array(3).fill(8)
console.log(arr12)
接受第二个和第三个参数，用于指定填充的起始位置和结束位置(左闭右不闭)
const arr13 = ['a', 'b', 'c'].fill(7, 0, 2)
console.log(arr13)
// [7, 7, 'c']
注意点： 如果填充的类型为对象，则是浅拷贝
entries()，keys()，values()
keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历
for (let index of ['a', 'b'].keys()) {
console.log(index)
}
// 0
// 1
for (let elem of ['a', 'b'].values()) {
console.log(elem)
}
// a
// b
for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem)
}
// 0 "a"
// 1 'b'
includes() 用于判断数组是否包含给定的值
[1, 2, 3].includes(2) // true
[1, 2, 3].includes(4) // false
[1, 2, NaN].includes(NaN) // true
方法的第二个参数表示搜索的起始位置，默认为0，参数为负数则表示倒数的位置
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true
flat()，flatMap()
将数组扁平化处理，返回一个新数组，对原数据没有影响
[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]
flat()默认只会“拉平”一层，如果想要“拉平”多层的嵌套数组，可以将flat()方法的参数写成一个整数，表示想要拉平的层数，默认为1
[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2) 表示想要拉平的层数为2
// [1, 2, 3, 4, 5]
flatMap()方法对原数组的每个成员执行一个函数相当于执行Array.prototype.map()，然后对返回值组成的数组执行flat()方法。该方法返回一个新数组，不改变原数组
const arr14 = [ [2, 4],
[3, 6],
[4, 8]
].flat()
console.log(arr14)
// [2, 4, 3, 6, 4, 8]
数组的空位
数组的空位: 数组的某一个位置没有任何值
ES6 则是明确将空位转为undefined，包括Array.from、扩展运算符、copyWithin()、fill()、entries()、keys()、values()、find()和findIndex()
sort() return a - b就是从小到大排序，，return b - a 就是从大到小排序
const arr15 = [7, 4, 5, 3, 1, 9, 10].sort((a, b) => {
return a - b
})
console.log(arr15)
// [1, 3, 4, 5, 7, 9, 10]
