1、find 和 findIndex
find() 传入一个回调函数,找到数组中符合当前搜索规则的第一个元素,返回这个元素,并且终止搜索。
const arr = [1, "2", 3, 3, "2"]
console.log(arr.find(n => typeof n === "number")) // 1
复制代码
findIndex() 与 find() 类似,只是返回的是,找到的这个元素的下标。
const arr = [1, "2", 3, 3, "2"]
console.log(arr.findIndex(n => typeof n === "number")) // 0
2、fill
用指定的元素填充数组,其实就是用默认内容初始化数组。基本用法:[].fill(value, start, end)
该函数有三个参数:填充值(value),填充起始位置(start,可以省略),填充结束位置(end,可以省略,实际结束位置是end-1)。
// 采用一个默认值,填充数组
const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
arr1.fill(7);
console.log(arr1); // [7,7,7,7,7,7,7,7,7,7,7]
// 制定开始和结束位置填充,实际填充结束位置是前一位。
const arr2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
arr2.fill(7, 2, 5);
console.log(arr2); // [1,2,7,7,7,6,7,8,9,10,11]
// 结束位置省略,从起始位置到最后。
const arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
arr3.fill(7, 2);
console.log(arr3); // [1,2,7,7,7,7,7,7,7,7,7]
3、from
将类似数组的对象(array-like object)和可遍历(iterable)的对象转为真正的数组。
const set = new Set(1, 2, 3, 3, 4);
Array.from(set) // [1,2,3,4]
Array.from('foo'); // ["f", "o", "o"]
4、of
Array.of() 方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型。
Array.of() 和 Array 构造函数之间的区别在于处理整数参数:Array.of(7) 创建一个具有单个元素 7 的数组,而 Array(7) 创建一个长度为7的空数组(注意:这是指一个有7个空位的数组,而不是由7个undefined组成的数组)。
Array.of(7); // [7]
Array.of(1, 2, 3); // [1, 2, 3]
Array(7); // [ , , , , , , ]
Array(1, 2, 3); // [1, 2, 3]
5、copyWithin
选择数组的某个下标,从该位置开始复制数组元素,默认从0开始复制。也可以指定要复制的元素范围。基本用法:[].copyWithin(target, start, end)
const arr = [1, 2, 3, 4, 5];
console.log(arr.copyWithin(3));
// [1,2,3,1,2] 从下标为3的元素开始,复制数组,所以4, 5被替换成1, 2
const arr1 = [1, 2, 3, 4, 5];
console.log(arr1.copyWithin(3, 1));
// [1,2,3,2,3] 从下标为3的元素开始,复制数组,指定复制的第一个元素下标为1,所以4, 5被替换成2, 3
const arr2 = [1, 2, 3, 4, 5];
console.log(arr2.copyWithin(3, 1, 2));
// [1,2,3,2,5] 从下标为3的元素开始,复制数组,指定复制的第一个元素下标为1,结束位置为2,所以4被替换成2
6、includes
判断数组中是否存在该元素,参数:查找的值、起始位置,可以替换 ES5 时代的 indexOf 判断方式。
const arr = [1, 2, 3];
arr.includes(2); // true
arr.includes(4); // false
复制代码
另外,它还可以用于优化 || 的判断写法。
if (method === 'post' || method === 'put' || method === 'delete') {
...
}
// 用 includes 优化 `||` 的写法
if (['post', 'put', 'delete'].includes(method)) {
...
}
7、entries、values 和 keys
entries() 返回迭代器:返回键值对
//数组
const arr = ['a', 'b', 'c'];
for(let v of arr.entries()) {
console.log(v)
}
// [0, 'a'] [1, 'b'] [2, 'c']
//Set
const arr = new Set(['a', 'b', 'c']);
for(let v of arr.entries()) {
console.log(v)
}
// ['a', 'a'] ['b', 'b'] ['c', 'c']
//Map
const arr = new Map();
arr.set('a', 'a');
arr.set('b', 'b');
for(let v of arr.entries()) {
console.log(v)
}
// ['a', 'a'] ['b', 'b']
复制代码
values() 返回迭代器:返回键值对的 value
//数组
const arr = ['a', 'b', 'c'];
for(let v of arr.values()) {
console.log(v)
}
//'a' 'b' 'c'
//Set
const arr = new Set(['a', 'b', 'c']);
for(let v of arr.values()) {
console.log(v)
}
// 'a' 'b' 'c'
//Map
const arr = new Map();
arr.set('a', 'a');
arr.set('b', 'b');
for(let v of arr.values()) {
console.log(v)
}
// 'a' 'b'
复制代码
keys() 返回迭代器:返回键值对的 key
//数组
const arr = ['a', 'b', 'c'];
for(let v of arr.keys()) {
console.log(v)
}
// 0 1 2
//Set
const arr = new Set(['a', 'b', 'c']);
for(let v of arr.keys()) {
console.log(v)
}
// 'a' 'b' 'c'
//Map
const arr = new Map();
arr.set('a', 'a');
arr.set('b', 'b');
for(let v of arr.keys()) {
console.log(v)
}
// 'a' 'b'