Open
Description
归纳es6 中常用的数组方法。方便平时熟练使用,记忆。
from
将类对象转为真正的数组:比如一些类数组的对象和可遍历的对象
let arrayLike = {
"0":'a',
"1":"b",
"2":"c",
length:3
}
// ES5 的写法
var arr1 = [].slice.call(arrayLike);
// ES6 写法
var arr2 = Array.from(arrayLike);
或者是 NodeList 集合 和 arguments对象
var nodeList = document.querySelectorAll("p");
var newArray = Array.from(nodeList); // 转换成数组。
// arguments
var args = Array.from(arguments);
of
of 方法用于将一组值,转换为数组。基本上可以用来替代Array() 或者 new Array(),
Array.of(1,2,3); // [1,2,3]
Array.of(1); //[1]
Array.of(undefined); // [undefined]
可以使用下面代码模拟
function ArrayOf() {
return [].slice.call(arguments);
}
copyWithin
Array.prototype.copyWithin(target,start = 0,end = this.length)
包含三个参数:
- target(必需): 从该位置开始替换,如果为负值,则表示倒数。
- start(可选): 从该位置开始读取数据,默认为0。负值 表示倒数。
- end(可选): 从该位置停止读取数据,默认等于数组长度。负值,表示倒数。
[1,2,3,4,5].copyWithin(0,3,4) // [4, 2, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(0, -2, -1) // [4, 2, 3, 4, 5]
find
数组实例的find方法,用于找出第一个符合条件的数组成员。
[1,2,3,4].find(function(value,index,arr){
return value>3
})
// 4
接受第二个参数,用来绑定this 值
var p = {number:3}
[1,2,3,4,5].find(function(value,index,arr){
return value>this.number
},p)
// 4
findIndex
返回第一个符合条件的数组成员的位置
[1,2,3,4].findIndex(function(value,index,arr){
return value>3
})
// 3
fill
fill 方法使用给定值,填充一个数组
new Array(4).fill(4); // [4, 4, 4, 4]
实现类似 [[1,1...],[2,2...],...[n,n,n...]] 这样的二维数组,里面子数组的值为动态的
var n = 5;
new Array(n).fill(2).map(function(value,index){ return new Array(n).fill(index)})
使用ES5写法
Array.fill = function(number,filler){
var arr = [];
for(var i =0;i<number;i++) {
arr.push(filler)
}
return arr;
}
Array.fill(4,1)
includes
返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes 方法类似。
ES2016引入该方法
[1,2,3].includes(1) // true;
[1,2,3,NaN].includes(NaN) // true
// 相对应的 indexOf 就无法检测出 NaN
[1,2,3,NaN].indexOf(NaN); // -1
Metadata
Metadata
Assignees
Labels
No labels