ES6 数组增加的方法

　　1, Array.of() 创建数组用，创建数组的新方法

　　这个方法的由来，主要是因为使用new Array() 创建数组的时候，行为不一致。当我们给new Array() 传递一个数字的时候，他不是创建一个数组包含这个元素，而是创建一个长度为这个数字的数组。但当传递一个其它类型的数据给new Array() 的时候，它只会创建包含这个元素的数组。

let arr1 = new Array(3);
console.log(arr1[0]) // undefined
console.log(arr1.length) // 3

let arr2 = new Array('3');
console.log(arr2[0]) // '3'
console.log(arr2.length) // 1

　　使用Array.of 创建数组就不一样了，给它传递一个参数，它永远是创建包含这个参数的数组，数组的length 永远为1. 把上面的new Array 改成Array.of 试一试

let arr1 = Array.of(3);
console.log(arr1[0]) // 3
console.log(arr1.length) // 1

let arr2 = Array.of('3');
console.log(arr2[0]) // '3'
console.log(arr2.length) // 1

　　不仅可以传递一个参数，你可以传递任意多个的参数，只要用逗号把它们一一隔开就好，这些参数都会成为数组的元素。

let arr1 = Array.of(3, 2, 1);
console.log(arr1[0], arr1[1], arr1[2]) // 3 2 1
console.log(arr1.length) // 3

　　总之，你不管传递什么内容给Array.of() 方法，这些内容最终都会成为数组的元素。

　　2, Array.from(), 接一个类数组对象或可迭代对象，把它们转化成数组。

　　一直都在说类数组对象，到现在才知道什么是类数组对象。就是一个对象的所有属性除了length这个属性之外，其余全都是数字，准确的说是数字型字符串。

let obj = { // 类数组对象
    0: 'sam',
    1: 'jason',
    length: 2
}

　　原来要把这个类数组对象转化为真正的数组需要调用Array.prototype.slice.call(obj); 比较麻烦，现在直接调用Array.from(obj) 就可以了。

let obj = { // 类数组对象
    0: 'sam',
    1: 'jason',
    length: 2
}

let arrFromObj = Array.from(obj)
console.log(Array.isArray(arrFromObj)) // true
console.log(arrFromObj) // [ 'sam', 'jason' ]

　　可迭代对象呢，也是ES6 新加的，这个以后再说，只要知道set 和map 都是可迭代对象就可以了。也就是说，可以把set 和map 也传递给Array.from()，生成一个新数组。

let set = new Set();
set.add(2);
set.add(4);

let map = new Map();
map.set('name', 'sam');
map.set('job', 'web');

let arrFromSet = Array.from(set)
console.log(Array.isArray(arrFromSet)) // true
console.log(arrFromSet) // [ '2',  '4']

let arrFromMap = Array.from(map);
console.log(Array.isArray(arrFromMap)) // true
console.log(arrFromMap) // [ [ 'name', 'sam' ], [ 'job', 'web' ] ]

　　除了第一个参数外，Array.from 还有第二个，第三个参数。第二个参数，一个函数，把可迭代对象或类数组对象转化为数组之前，先对对象中的每一项都调用一次函数，函数返回的新值组成转换后的数组。

let set = new Set();
set.add(2);
set.add(4);

let arrFromSet = Array.from(set, value => value + 10)
console.log(Array.isArray(arrFromSet)) // true
console.log(arrFromSet) // [ 12,  14]

　　set 迭代对象转化为真正的数组之前，每一项2， 4都先调用一次函数value => value + 10. 然后返回12, 14, 这些返回的新值，组成转换后的数组[12, 14];

　　如果第二个参数---函数---- 中，有this, 可以给Array.from 传递第三个参数，指定this的指向

let set = new Set();
set.add(2);
set.add(4);

let helper = {
    diff: 1,
    add(value) {
        return value + this.diff;
    }
};

let arrFromSet = Array.from(set, helper.add, helper);
console.log(arrFromSet) // [3, 5]

　　3, find(), findIndex()

　　根据名字也可以看出来，他们是查找元素用的，用法every, some一样，都是接受一个函数参数，和一个可选的this, find 是返回查找到满足条件的元素，findIndex 则是返回查找到满足条件的元素的索引。看一个简单的例子就明白了

let arr = [1, 2, 3, 4, 5];
let elem = arr.find(item => item > 3);
let elemIndex = arr.findIndex(item => item > 3);

console.log(elem, elemIndex) // 4, 3

　　函数作为参数规定了要满足的条件，可以发现，只要有一个元素满足条件，它就不进行查找，直接返回了。

ES6 数组增加的方法

猜你喜欢