ES6的 数组

扩展运算符
  • 含义
    扩展运算符(spread)是三个点(...)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。
    代码

    结果

    该运算符主要用于函数调用。
    代码

    结果

    上面代码中add(...numbers)是函数的调用,它使用了扩展运算符。该运算符将一个数组,变为参数序列。
    扩展运算符与正常的函数参数可以结合使用,非常灵活。扩展运算符后面还可以放置表达式。如果扩展运算符后面是一个空数组,则不产生任何效果。
    注意:\color{red}{只有函数调用时,它才可以放在圆括号中,否则会报错。}
  • 扩展运算符的应用
    (1)复制数组
    数组是复合的数据类型,直接复制的话,只是复制了指向底层数据结构的指针,而不是克隆一个全新的数组。
    代码

    结果

    扩展运算符提供了复制数组的简便写法。
    代码

    结果

    (2)合并数组
    扩展运算符提供了数组合并的新写法。
    代码

    结果

    代码

    结果

    (3)与解构赋值结合
    扩展运算符可以与解构赋值结合起来,用于生成数组。
    代码

    结果

    注意:\color{red}{如果将扩展运算符用于数组赋值,只能放在参数的最后一位。}
    (4)字符串
    扩展运算符还可以将字符串转为真正的数组。
    代码

    结果

    (5)实现了 Iterator 接口的对象
    任何定义了遍历器(Iterator)接口的对象(参阅 Iterator 一章),都可以用扩展运算符转为真正的数组。
    代码

    结果

    (6)Map 和 Set 结构,Generator 函数
    扩展运算符内部调用的是数据结构的 Iterator 接口,因此只要具有 Iterator 接口的对象,都可以使用扩展运算符,比如 Map 结构。
    代码

    结果
数组创建
  • Array.of()
    将参数中所有值作为元素形成数组。


    代码

    结果
  • Array.from()
    将类数组对象或可迭代对象转化为数组。


    代码

    结果
扩展的方法
  • find()
    查找数组中符合条件的元素,若有多个符合条件的元素,则返回第一个元素。


    代码

    结果
  • findIndex()
    查找数组中符合条件的元素索引,若有多个符合条件的元素,则返回第一个元素索引。


    代码

    结果
  • fill()
    将一定范围索引的数组元素内容填充为单个指定的值。


    代码

    结果
  • copyWithin()
    将一定范围索引的数组元素修改为此数组另一指定范围索引的元素。


    代码

    结果
  • entries()
    遍历键值对。


    代码

    结果
  • keys()
    遍历键名。


    代码

    结果
  • values()
    遍历键值。


    代码

    结果
  • includes()
    数组是否包含指定值。
    代码

    结果

    注意:\color{red}{与 Set 和 Map 的 has 方法区分;Set 的 has 方法用于查找值;Map 的 has 方法用于查找键名。}
  • flat()
    嵌套数组转一维数组。


    代码

    结果
  • flatMap()
    先对数组中每个元素进行了的处理,再对数组执行 flat() 方法。


    代码

    结果
  • map()
    映射,一个对一个。


    代码

    结果
  • reduce()
    汇总, 一堆出来一个,用于比如,算个总数,算个平均等。


    代码

    结果
  • filter()
    过滤器 保留为true的。


    代码

    结果
  • forEach()
    循环迭代。


    代码

    结果
Array.prototype.sort() 的排序稳定性

排序稳定性(stable sorting)是排序算法的重要属性,指的是排序关键字相同的项目,排序前后的顺序不变。

代码

结果

代码

结果

常见的排序算法之中,插入排序、合并排序、冒泡排序等都是稳定的,堆排序、快速排序等是不稳定的。不稳定排序的主要缺点是,多重排序时可能会产生问题。假设有一个姓和名的列表,要求按照“姓氏为主要关键字,名字为次要关键字”进行排序。开发者可能会先按名字排序,再按姓氏进行排序。如果排序算法是稳定的,这样就可以达到“先姓氏,后名字”的排序效果。如果是不稳定的,就不行。
早先的 ECMAScript 没有规定,Array.prototype.sort()的默认排序算法是否稳定,留给浏览器自己决定,这导致某些实现是不稳定的。ES2019 明确规定,Array.prototype.sort()的默认排序算法必须稳定。这个规定已经做到了,现在 JavaScript 各个主要实现的默认排序算法都是稳定的。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,509评论 6 504
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,806评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,875评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,441评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,488评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,365评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,190评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,062评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,500评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,706评论 3 335
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,834评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,559评论 5 345
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,167评论 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,779评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,912评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,958评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,779评论 2 354

推荐阅读更多精彩内容