es6 数组的扩展方法

扩展运算符
（…）将一个数组转为用逗号分隔的参数序列
替代函数的 apply 方法：

function f(x,y,z){
	//  ...
}
var args = [0,1,2]
f.apply(null,args)     // es5
f(...args)             // es6

应用
1.复制数组

const a1 = [0,1,2]
const a2 = a1.concat()   // es5
const a2 = [...a1]       // es6

2.合并数组

const arr1 = [0,1,2]
const arr2 = [3,4,5]
arr1.concat(arr2)  //  [0,1,2,3,4,5]  es5
[...arr1,...arr2]  //  [0,1,2,3,4,5]  es6

3.结合解构赋值
如果将扩展运算符用于数组赋值，只能放在参数的最后一位，否则会报错

const[first,...rest] = [0,1,2,3,4]
first //  0
rest  //  [1,2,3,4]

4.字符串

[...'hello'] // ['h','e','l','l','o']

Array.from()
Array.from 方法用于将两类对象转为真正的数组：类似数组的对象和可遍历的对象（包括 Set 和 Map）

// 类似数组的对象
let obj = {
	'0':'a',
	'1':'b',
	'2':'c',
	length:3
}
var arr1 = [].slice.call(obj)  //  es5
var arr2 = Array.from(obj)     //  es6

本质：必须拥有length属性
Array.from 还可以接受第二个参数，作用类似于 map 方法，对每个元素进行处理，将处理后的值放入返回的数组。

Array.from(arrayLike,x => x*x)
Array.from(arrayLike).map(x => x*x)

Array.from([1,2,3],(x) => x*x )   //  [1,4,9]

另一个应用是字符串转数组，然后返回字符串的长度。
Array.of()
Array.of方法用于将一组值，转换为数组。用来弥补数组构造函数 Array() 的不足。

Array()  //  []
Array(3)  //  [, , ,]
Array(1,2,3)  //  [1,2,3]
Array.of()  //  []
Array.of(undefined)  //  [undefined]
Array.of(1)  //  [1]

Array 在没有参数、一个参数、多个参数时候返回结果不同，只有当参数个数不少于2个时，Array() 才会返回参数组成的新数组；参数个数只有一个时，指定数组的长度。
数组实例的 copyWithin()
在当前数组中，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。会改变原数组。

Array.prototype.copyWithin(target,start = 0,end = this.length)

• target(必需)：从该位置开始替换数据。如果为负值，表示倒数
• start(可选)：从该位置开始读取数据，默认为0。如果为负值，表示从末尾开始计算
• end(可选)：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示从末尾开始计算。

数组实例的 find() 和 findIndex()
find() 用于找出第一个符合条件的数组成员。第一个参数是一个回调函数，所有数组成员依次执行该函数，直到找出第一个返回值为true 的成员，然后返回该成员。如果没有符合条件的，则返回undefined

[-1,0,1,2,3].find( (n) => n>0 )  //  1
[-1,0,1,2,3].find( function(value,index,arr){
	return value > 0
})  //  1

find 方法的回调函数可以接受三个参数，当前的值、当前的位置、原数组
findIndex 和 find 类似，返回第一个符合条件的成员的位置，如果都不符合返回- 1。

[-1,0,1,2,3].findIndex( function(value,index,arr){
	return value > 0
})  //  2

这两个方法都可以接受第二个参数，用来绑定回调函数的this 对象。

function f(v){
	return v > this.age
};
let person = { name: 'zs',age: 18 };
[10,20,30].find(f,person)  //  20

两个方法都可以发现 NaN，弥补了数组的 indexOf 方法的不足

[NaN].indexOf(NaN)  //  -1
[NaN].findIndex( e => Object.is(NaN,e) )  //  0

数组实例的 fill()
fill 方法使用定值，填充一个数组

['a','b','c'].fill(7)  //  [7,7,7]
new Array(3).fill(7)  //  [7,7,7]
['a','b','c'].fill(7,1,2)  //  ['a',7,'c']

fill 方法还可以接受第二个和第三个参数，用于指定填充的起始位置和结束位置
如果填充的类型为对象，那么被赋值的是同一内存地址的对象，而不是深拷贝对象
数组实例的 entries() keys() 和 values()
三个方法用于遍历数组，返回一个遍历器对象，可以用for…of 循环遍历，keys 是对键名的遍历，values 是对键值的遍历，entries 是对键值对的遍历。

for(let index of ['a','b'].keys()) {
	console.log(index)
}  //  0  1
for(let item of ['a','b'].values()) {
	console.log(item )
}  //  a  b
for(let [index,item] of ['a','b'].entries()) {
	console.log(index,item)
}  //  0 'a'  1 'b'

数组实例的 includes()
include 方法返回一个布尔值，表示某个数组是否包含给定的值，该方法的第二个参数表示搜索的起始位置，默认为0，若为负数，则表示倒数（如果此时大于数组长度，则从0开始）

[1, 2, 3].includes(2)     // true
[1, 2, 3].includes(4)     // false
[1, 2, NaN].includes(NaN) // true
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true

indexOf 缺点：不够语义化，含义是找到参数值出现的第一个位置，要和 -1做比较 不够直观；内部使用 === 进行判断，导致对 NaN 误判
数组实例的 flat() flatMap()
数组的成员还是数组时，flat 方法将嵌套的数组‘拉平’，变成一位数组。该方法返回一个新数组，不改变原数组。

[1, 2, [3, 4]].flat()  //  [1,2,3,4]
[1, 2, [3, [4, 5]]].flat()  //  [1,2,3,[4,5]]
[1, 2, [3, [4, 5]]].flat(2)  //  [1,2,3,4,5]

flat 默认‘拉平’一层，可以将参数写成一个整数，表示想要拉平的层数，默认为1；也可写成 Infinity。如果原数组有空位，会跳过空位。
flatMap 方法对原数组每一个成员执行一个函数 然后对返回值组成的数组执行 flat 方法。该方法返回一个新数组，不改变原数组。

[2, 3, 4].flatMap((x) => [x, x * 2])  //  [2, 4, 3, 6, 4, 8]

flatMap 只能展开一层数组。flat 的参数是一个遍历函数，该函数可以接收三个参数，分别是 当前成员、当前数组成员的位置、原数组；还可以接受第二个参数，用来绑定遍历函数里的 this
数组的空位
ES5：

• forEach() filter() every() some() 跳过空位
• map() 会跳过空位，但会保留这个值
• join() toString() 会将空位视为 undefined，undefined 会被处理成空字符串

[,'a'].forEach((x,i) => console.log(i)); // 1
['a',,'b'].filter(x => true) // ['a','b']
[,'a'].every(x => x==='a') // true
[1,,2].reduce((x,y) => x+y) // 3
[,'a'].some(x => x !== 'a') // false
[,'a'].map(x => 1) // [,1]
[,'a',undefined,null].join('#') // "#a##"
[,'a',undefined,null].toString() // ",a,,"

ES6 中则是将空位转为 undefined

Array.from([0,,1])  //  [0,undefined,1]
[...[0,,1]]  //  [0,undefined,1]
[,'a','b',,].copyWithin(2,0) // [,"a",,"a"]
new Array(3).fill('a') // ["a","a","a"]

entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。

[...[,'a'].entries()] // [[0,undefined], [1,"a"]]
[...[,'a'].keys()] // [0,1]
[...[,'a'].values()] // [undefined,"a"]
[,'a'].find(x => true) // undefined
[,'a'].findIndex(x => true) // 0