ES6小实验-数组的扩展
数组方法已经很多,ES6给数组又增加了不少方法:
1.Array.from():用于将两类对象转为真正的数组,类似数组的对象(array-like object) 和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)
let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length:3 } let arr = Array.from(arrayLike) console.log(arr)//["a", "b", "c"]
如果把上面的length:3去掉,那么转化就失败,因为没有length属性,它就不是一个类似数组的对象了。Array.from()还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组
var arrayLike = { '0': 1, '1': 2, '2': 3, length: 3 }; var arr = Array.from(arrayLike, function (x) { return x * x; }); console.log(arr);//[1, 4, 9]
2.Array.of():用于将一组值,转换为数组
let arr = Array.of(1,2,3) console.log(arr)//[1, 2, 3]
3.Array.prototype.copyWithin():数组实例的copyWithin方法,在当前数组内部,将指定位置的成员复制到其他位置(会覆盖其他位置的原有成员),然后返回当前数组
Array.prototype.copyWithin(target,start = 0,end=this.length)
它接受三个参数(1)target(必须):从该位置开始替换数据
(2)start(可选):从该位置开始读取数据,默认为0
(3)end(可选):到该位置前停止读取数据,默认等于数组长度
var arr = [5,4,3,2,1].copyWithin(0,3) console.log(arr)//[2, 1, 3, 2, 1]
上面0是target,3是起始位置,end默认为数组长度
4.find():用于找出第一个符合条件的数组成员,它的参数是一个回调函数
var arr = [5, 4, 3, 2, 1].find(function (value, index, arr) { return value > 3; }); console.log(arr); //5
5.findIndex(): 返回第一个符合条件的数组成员的位置
var arr = [5, 4, 3, 2, 1].findIndex(function (n) { return n > 3; }); console.log(arr); //0
6.fill(): 使用定值,填充一个数组,可以接收第二个和第三个参数,用于指定填充的起始位置和结束位置,感觉ES6所加的方法比较适合数组的大规模改变,如果是少量的变动,用ES5的方法一样可以做到
var arr = ['a','b','c'].fill(7,1,2) console.log(arr)//["a", 7, "c"]
7.entries(),keys(),values() :用于遍历数组,它们都返回一个遍历器对象,keys是对键名的遍历,values()是对键值的遍历,entries()是对键值对的遍历,实验了下却发现chrome并不认识values()这个方法,其他两个都认识
for(let index of ['a','b'].keys()) { console.log(index) } //0 //1 for(let elem of ['a','b'].values()) { console.log(elem) } //? for(let [index, elem] of ['a', 'b'].entries()) { console.log(index, elem) } //0 "a" //1 "b"
8.includes() 返回一个布尔值,表示某个数组是否包含给定的值,它可以接受第二个参数表示搜索的起始位置,默认为0
console.log([1,2,3].includes(2))//true console.log([1,2,3].includes(4))//false