8.数组的扩展
1.扩展运算符
将数组转为用逗号分隔的参数序列,主要用于函数调用
例子:
function add(x, y) {
return x + y;
}
const numbers = [4, 38];
add(...numbers) // 42
该扩展运算符,替代了函数的apply,例如:
扩展运算符的应用:
1)复制数组
arr2=arr1只是让ar2的地址指向arr1,改变arr1的值,arr2的会变;改变arr2的值,arr1也会变;
实现真正的复制,es5中用arr2=arr1.concat();
使用该扩展运算符只需arr2=[...arr1]; 或者 [...arr2]=arr1;
2) 合并数组
es5做法:使用concat方法,例如arr1.concat(arr2,arr3);
es6做法:扩展运算符,例如[...arr1,...arr2,...arr3]
3)结合解构赋值
4)字符串
将字符串转换成真正的数组 [...str] ,涉及Unicode字符
Array.from(str)也可以
5)可以将Iterator 接口的对象转成真正的数组?
6)Map 和 Set 结构,Generator 函数??
2.Array.from()
用于将两类对象转为真正的数组:类似数组的对象(array-like object,本质特征只有一点,即必须有length属性)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)
例如:
3.Array.of()
总是返回参数值组成的数组。如果没有参数,就返回一个空数组
弥补数组构造函数Array()的不足,例如:
该方法可以由如下代码模拟实现
function ArrayOf(){
return [].slice.call(arguments);
}
4.数组实例的copyWithin()
上图中的代码,自己理解的是:
{length:5,3:1}等同于{0:undefined,1:undefined,2:undefined,3:1,4:undefined,length:5}
调用copyWithin(0,3),就是将3:1,4:undefined的值换到前两项,得到:{0:1,1:undefined,2:undefined,3:1,4:undefined,length:5},等同于
{0:1,3:1,length:5}
同问题参考链接:问题链接
这个理解在如下写法中也是成立的
5.数组实例的find()和findIndex()
find():找出第一个符合条件的数组成员,返回该成员
findIndex:与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
6.数组实例的fill()
使用给定值,填充一个数组
7.遍历数组--数组实例的keys(),values(), entries()
都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。
for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"
8.数组实例的includes()
返回布尔值,表示数组中是否包含给定的值,和字符串的includes()相似;第二个参数表示搜索的起始位置,默认0
例如:[1,2,NaN].includes(NaN); //true
es5中用arr.indexOf()===-1来实现该目的,其缺点:
1)不够语义化
2)indexOf()使用的是严格的===,会对NaN误判,如:[NaN].indexOf(NaN);//-1
另外,Map 和 Set 数据结构有一个has方法,需要注意与includes区分。
Map 结构的has方法,是用来查找键名的,比如Map.prototype.has(key)、WeakMap.prototype.has(key)、Reflect.has(target, propertyKey)。
Set 结构的has方法,是用来查找值的,比如Set.prototype.has(value)、WeakSet.prototype.has(value)。
9.数组的空位(数组中尽量避免出现空位)
ES6 则是明确将空位转为undefined