ES6中新增扩展一（数组篇）

一、扩展运算符

核心概念：将数组变成参数序列

1、可用于函数调用时将一个数组变成参数序列

function push(array, ...item){
 return array.push(...item);
}

2.将某些数据结构转化为数组

[...document.querySelectorAll('div')]

3、数组的合并

let arr1=[2,3,4,5];
let arr2 = [4,5,6,7];
let arr=[...arr1, ...arr2];
console.log(arr); //[2, 3, 4, 5,4, 5, 6, 7]

4、与解构赋值结合起来使用

注意：扩展运算符自能放在参数的最后一个位置，否则会报错

const [first, ...rest] = [1,2,3,4,5,6];
console.log(first); //1
console.log(rest);//[ 2, 3, 4, 5, 6 ]
console.log(...rest); // 2 3 4 5 6

5、将字符串转化为数组

console.log(...'javascript'); // j a v a s c r i p t
console.log([...'javascript']);//[ 'j', 'a', 'v', 'a', 's', 'c', 'r', 'i','p', 't']  
相当于字符串的split函数（将字符串分割成字符串数组）

可见如果扩展运算符后面不是数组而是字符串的时候也可以正常扩展

二、数组的构造函数新增方法

1、Array.from

将类似数组的对象和可遍历的对象（iterable)包括Set和Map转化成数组

let arrayLike = {
  '0': 'first',
  '1': 'second',
 '2':'third',
  length: 3
}
console.log(Array.from(arrayLike)); //[ 'first', 'second', 'third' ]

注意，如果key从0开始，如果key值得存在，则生成的数组对应的index处的值为undefined

2.Array.of()

将一组值转换为数组

console.log(Array(2,3,4)); //[ 2, 3, 4 ]
console.log(Array.of(2,3,4,4)); //[ 2, 3, 4, 4 ]
console.log(Array.of(3)); //[ 3 ]
console.log(Array(3)); //[ <3 empty items> ] 包含3个空值的数组

三、实例对象新增方法

• copyWith()

• find()

• findindex

• fill()

• enteries()

• values()

• keys()

• includes()

• flat()

• flatMap()

1.copyWithin()

将指定位置的数组元素复制到其他的位置，返回覆盖后的新数组

let arr= [3,4,9,5,6,7];
let result = arr.copyWithin(0, 2, 3);
console.log(result); //[ 9, 4, 9, 5, 6, 7 ]

第一个参数表示要开始替换的数组索引号，第二个参数表示从那个位置开始复制数组，最后一个表示那个位置结束（但是不包括这个位置的值）

2.find（）

返回第一个符合条件的数组元素，find的参数是一个函数，函数参数可包含（value,index，array）

3.findIndex()

返回第一个符合条件的数组元素对应得索引号，如果所有的元素都不符合条件，则返回-1.

4.fill()

将给定值作为函数的参数，覆盖原有数组的值，可接受第二个和第三个参数，表示覆盖的初始位置和终始位置（不包含终始位置）

let arr=[1,2,3,4];
arr.fill(2,0,2);
console.log(arr); //[ 2, 2, 3, 4 ]
arr.fill(3);
console.log(arr); //[ 3, 3, 3, 3 ]

5、flat()

将数组扁平化处理，返回一个新数组，对原数组没有影响

let arr = [3,4,[4,5,[4,2,2]]];
 //flat（）参数默认值为1，只处理一层
console.log(arr); //[ 3, 4, [ 4, 5, [ 4, 2, 2 ] ] ] 不改变原数组
console.log(arr.flat()); //[ 3, 4, 4, 5, [ 4, 2, 2 ] ]

处理两层
console.log(arr.flat(2)); //[3, 4, 4, 5,4, 2, 2]

flatMap()

对每个数组成员执行map方法，然后再将返回的结果执行flat方法

let arrs = [3,3,4,6,7,8];
let newarr  = arrs.flatMap(value=>[value, value*3]);
console.log(newarr); [3,  9,  3, 9,  4,12,  6, 18, 7, 21,8, 24]