专栏首页萌兔itJavaScript第十四弹——ES6(三)数组的扩展

JavaScript第十四弹——ES6(三)数组的扩展

Hello,小伙伴们,周末愉快呀,今天延续前天的话题,上次说了ES6对字符串的扩展,今天我们来谈谈约定好的数组的扩展吧~~

1

数组的扩展

扩展运算符

首先登场的是扩展运算符,它一般是通过(…)表示的。它能够将一个数组转化为逗号分隔的参数序列。

比如:

了解了什么是扩展运算符,我们来说说它会被用到哪里吧~

1)函数调用:如下面的函数中,我们将数组a通过扩展运算符变成了参数,并进行相加得到结果,可以说函数中所需要的参数越多,扩展运算符的作用越能体现。

有一点要注意:当扩展运算符被放置在了括号中时,JS的引擎就会认为这是函数的调用。如果这时不是函数调用就会报错了,啥意思,看个例子!上面的一段代码能够正常输出,但是下面一段代码就会报错啦!因为被当成函数调用啦!

2) 复制数组:还记得浅拷贝与深拷贝吗?数组是一个复合型数据,对它进行复制,我们就要通过深拷贝,但是大家都知道这很麻烦。

ES5中我们可以选择concat函数另辟蹊径来复制:

ES6中:就可采用扩展运算符咯!可以采用两种方式对数组进行复制,可以将扩展运算符使用于被复制项也可以是复制目标项。

3)与解构赋值相结合:但是要注意,在用于解构赋值的时候,一定要把扩展运算符放在最后哦~不然会报错!(是不是有小伙伴忘记了什么是解构赋值了

,快回到上一篇看看)

常用函数

1)Array.from():将类似数组和可遍历的对象转化成数组,如set、字符串等

2)Array.of():将一组值转化为数组

数组实例函数

1)copyWithIn(target,start):在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组,千万不要误会这个参数哦,并不是从几号位到几号位而是把start开始到数组结束的值复制到target开始的位置。看下面的例子就是从3号位到结束的值复制到从0号位开始的位置。

2)find() vs findIndex():

find():用于找出第一个符合条件的数组成员。

findIndex():findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。与find()不同的是,find返回的是查到的值,而findIndex返回的是位置号

3)fill():fill方法使用给定值,填充一个数组。

4)entries(), keys(), values()

entries():对键值对的遍历

keys():对键名的遍历

values():对键值的遍历

5)includes():表示某个数组是否包含给定的值,与字符串的includes方法类似

6)flat() vs flatMap()

flat():将子数组的成员取出来,添加在原来的位置。默认拉平一层,可以添加参数代表拉平的层数

flatMap():对原数组的每个成员执行一个函数(相当于执行Array.prototype.map()),然后对返回值组成的数组执行flat()方法。该方法返回一个新数组,不改变原数组。

好啦~今天的分享就到这里啦,记住数组新的方法了吗,喜欢兔妞的文章请关注+在看哦~~

本文分享自微信公众号 - 萌兔it(mengtu_it),作者:萌兔IT

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-03-16

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • JavaScript入门总结——第三弹 数组大放送

    Hello大家好~~首先在这里祝大家元宵节快乐呢,大家吃汤圆了吗,兔妞反正还没吃呢,等着晚上放开肚子吃呢,糯叽叽糯叽叽,嘿嘿

    萌兔IT
  • 数据结构与JS也可以成为CP(一)数组

    Hello小伙伴们,经过了最近的一些介绍,我们今天又返回了JS,为什么呢?我们主要是对数据结构进行一下介绍,很多小伙伴认为对于前端来说数据结构不重要,曾经的我也...

    萌兔IT
  • Vue系列(五)——渲染之二三事

    Hello小伙伴们,好久不见,大家五一过得怎么样呢~反正兔妞出去以日均2w步的运动量玩耍一圈回来已经要散架了,所以稍休息了几天,今天就继续我们的Vue的专题吧。...

    萌兔IT
  • VBA数组(三)数组赋值

    大家好,上节介绍了在使用数组之前如何声明数组,本节就来介绍静态数组如何赋值。(动态数组会单独一节讲解)

    无言之月
  • js--数组方法

    01、concat()---合并数组的方法 02、join(separator)--把数组的所有元素放入一个字符串。元素通过指定的分隔符separator进行分...

    小蔚
  • Java Arrays工具类的使用

    Arrays 类 java.util.Arrays类能方便地操作数组,它提供的所有方法都是静态的。具有以下功能: 给数组赋值:通过fill方法。 对数组...

    郭耀华
  • Java基础-数组的常见操作

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明...

    cwl_java
  • Java Arrays工具类的使用

    郭耀华
  • 死磕 java集合之CopyOnWriteArrayList源码分析

    CopyOnWriteArrayList是ArrayList的线程安全版本,内部也是通过数组实现,每次对数组的修改都完全拷贝一份新的数组来修改,修改完了再替换掉...

    彤哥
  • 死磕 java集合之CopyOnWriteArrayList源码分析

    CopyOnWriteArrayList是ArrayList的线程安全版本,内部也是通过数组实现,每次对数组的修改都完全拷贝一份新的数组来修改,修改完了再替换掉...

    zhisheng

扫码关注云+社区

领取腾讯云代金券