ES6新特性有哪些?快来看看吧(五)

今天讲一下数组的拓展方法;

拓展运算符(spread)


可以很直观的看到他的作用 是将一个数组转为用逗号分隔的参数序列。

该运算符用在函数的调用

例如


注意只有在函数调用时,才可以放在圆括号中,否则会报错。

扩展运算符的出现代替了函数apply方法;


因为在ES5中,push方法的参数不能是数组,所以只能通过apply方法变通使用push方法,有了spead方法,就可以直接将数组传入push方法。

它有那些应用呢?


先看看这个:

数组是复合的数据类型,直接复制的话,只是复制了指向底层数据结构的指针,而不是克隆一个全选的数组。

上述代码中,a2并不是a1 的克隆,而是同一份数据的另一个指针。修改a2,会直接导致a1的变化。

ES5中只能用变通的方法来复制数组。


a1会返回原数组的克隆,在修改a2就不会对a1产生影响了。



两种方法都是克隆;

扩展运算符提供了数组合并的新方法。


但是这样两种方法都是浅拷贝。

扩展运算符也可以和解构赋值一起使用,用于生成数组;


但是如果将扩展运算符用于解构赋值,只能放在参数的最后一位,否则会报错。

扩展运算符还可以将字符串转为真正的数组。


Array.from();

此方法用于将类似数组的对象和可遍历的对象转为真正的数组,从而使用数组的方法;


ES6写法


ES5写法

然鹅在实际应用中,常见的类似数组的对象是DOM操作返回的Nodelist集合。以及内部函数arguments对象。用此方法就可以将他们转为真正的数组。

只要是部署了Iterator接口的数据结构,Array.from都可以将其转为数组。

Array.from()还支持类似数组的对象,本质特征只有一点。必须拥有length属性。


而且此方法还可以接收第二个参数,类似于数组map的方法,用来对每个元素进行处理,将处理后的值放入返回的数组。


Array.of()

此方法用于将一组值,转为数组。


上面描述中,可以看懂。一个参数,两个参数,及三个参数每次返回的值不同。参数只有一个正整数时,实际上指定数组的长度。参数个数不少于2个时,才返回由参数组成的新数组。

Array.of(),总是返回参数值组成的数组。如果没有参数,就会返回一个空数组。

find()

此方法用于找出第一个复合条件的数组成员,参数是一个回调函数,所有的成员依次执行该回调函数,直到找到第一个返回值为true的成员。然后返回该成员,没有找到。返回undefined。



上面代码中,find方法的回调函数可以接受三个参数,依次为当前的值,当前的位置,以及原数组。

findIndex():此方法和find()方法非常类似,返回的是第一个条件的数组成员位置。如果都不符合返回-1

fill();

此方法使用给定值,填充一个数组。

此方法用于填充空数组非常方便,但是数组中已有的元素,会被全部抹去

此方法还可以接受第二个和第三个参数。用于指定填充的其实位置和结束位置。


flat();

此方法用于将嵌套的数组‘拉平’,变成一维数组,该方法返回一个数组,对原数据没有影响。


但是。此方法默认拉平一层,可以进行传参,将参数写成一个整数,表示想要拉平的层数,默认为1.

flatMap();

此方法的作用是,对原数组的每个成员执行一次函数,然后在对返回值进行flat()方法。

返回值:返回一个新数组,

不会改变原数组。


但是默认只能展开一层,

此方法的参数是一个遍历函数,该函数可以接受三个参数,分别是当前数组成员,当前数组成员的位置(从零开始),原数组;

at();

ES6之前,数组不支持负索引,先要引用数组的最后一个成员,只能使用arr[arr.length-1];

ES6中增加了新方法,可以支持负数索引。


如果参数位置超出了数组范围,at()返回undefined;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容