ES6:数组扩展

Array.from()

Array.from()把类数组转化为数组

var arr = Array.from('string')
//["s","t","r","i","n","g"]
复制代码

Array.from()接受第二个参数，支持回调函数对类数组当中的内容进行操作然后取到想要的值（和map()类似）

var obj = {
    '0' : 'k',
    '1' : 'i',
    '2' : 'w',
    '3' : 'i',
    length : 4
}
var arr1 = Array.from(obj, function(item, index){
    return item + index
})
//arr1 ->["k0", "i1", "w2", "i3"]
//上下两种方法结果一样，运行相识
var arr2 = Array.from(obj).map((item,index) => item + index)
//arr2 ->["k0", "i1", "w2", "i3"]
复制代码

将类数组对象转换为真正数组，

//创建3个div元素，文本内容分别是aa、bb、cc
var divs = document.getElementsByTagName('div');
//divs 是类数组
var divText = Array.from(divs,item => item.innerText)
//["aa", "bb", "cc"]
复制代码

不是简单的将数组直接返回，而是返回一个一模一样的 【新数组】

var arrA = [12,11,13];
var arrB = Array.from(arrA);
console.log(arrA, arrB, arrA == arrB);
//[12,11,13] [12,11,13] false
复制代码

Array.of()

Array.of()创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型

var arr = Array.of(1,2,3,4,5)//[1,2,3,4,5]
console.log(arr);
复制代码

Array.of()和new Array()构造函数比较

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

Array.of(3);       // [3] 
new Array(3);          // [ , , ]
复制代码

模拟Array.of()方法

function arrayof(){
    return Array.prototype.slice.call(arguments)
}
console.log(arrayof(1,2,3));
复制代码

数组实例的方法 copyWithin()

copyWithin()用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

Array.prototype.copyWithin(target, start, end)

var arr = [0,1,2,3,4,5,6,7]
console.log(arr.copyWithin(0, 3))
//[3, 4, 5, 6, 7, 5, 6, 7]
var arr1 = [0,1,2,3,4,5,6,7]
// console.log(arr1.copyWithin(2, 3, 5))
//[0, 1, 3, 4, 4, 5, 6, 7]
var arr2 = [0,1,2,3,4,5,6,7]
console.log(arr2.copyWithin(0, -3, -2))
//[5, 1, 2, 3, 4, 5, 6, 7]
复制代码

对比fill()用一个固定值替换数组的元素。

array.fill(value, start, end)

var arr = new Array(5)
arr.fill(7)       //[7,7,7,7,7]
arr2.fill(8,3,4)  //[7,7,7,8,7]
复制代码

数组实例的方法 entries() keys() values()

entries() keys() values()对数组/下标进行遍历，返回迭代器对象（values()chrom 不支持）

var arr = [8,10,0,12];
var a = arr.keys();
var b = arr.values();
console.log(a.next().b)

for([item, index]of arr.entries()){
    console.log(item, index);
}
//0 8
//1 10
//2 0
//3 12
复制代码

数组实例的方法 find() findIndex() includes()

与indexof()相比可以根据条件进行查找

find()

找到对应条件的值是返回对应的键值，没有找到就返回undefined

var arr = [8,10,0,12];
var num1 = arr.find(item => item > 8)//10
var num2 = arr.find(item => item > 9)//undefined

复制代码

findIndex()

找到对应条件的值是返回对应的键名，没有找到就返回-1

var arr = [8,10,0,12];
var num1 = arr.findIndex(item => item > 10)//3
var num2 = arr.findIndex(item => item > 13)//-1 
复制代码

includes()

找到对应的值返回true，找不到返回false。

var arr = [8,10,0,12];
var num1 = arr.includes(2)//false
var num2 = arr.includes(12)//true
复制代码

可以找到NaN

var arr = [NaN];
var num1 = arr1.includes(NaN);//true
var num2 = arr1.indexOf(NaN);//-1
复制代码