用Array.includes替换Array.indexOf

Array.indexOf“返回可以找到给定元素的第一个索引,”MDN文档说。但是,如果我们只需要知道我们的数组是否包含值,该怎么办?对于这种情况,我建议使用返回布尔值的Array.includes。

使用Array.find而不是Array.filter

Array.filter是一个非常有用的方法。它从另一个数组创建一个新数组,所有项都传递回调参数。正如其名称所示,我们必须使用此方法进行过滤,并获得更短的数组。

但是,如果我们知道我们的回调函数只能返回一个项目,我就不推荐它 - 例如,当使用通过唯一ID过滤的回调参数时。在这种情况下,Array.filter将返回一个只包含一个项目的新数组。通过查找特定的ID,我们的意图可能是使用数组中包含的唯一值。

我们来谈谈性能。要返回与回调函数匹配的所有项,Array.filter必须浏览整个数组。此外,让我们假设我们有数百个项目满足我们的回调参数。我们过滤的阵列会非常大。

避免这些情况,我建议使用Array.find。它需要一个像Array.filter这样的回调参数,并返回满足此回调的第一个元素的值。此外,只要项目满足回调的时候,Array.find就会停止。无需浏览整个阵列。

用Array.some替换Array.find

在前面的例子中,我们看到Array.find需要一个回调作为参数并返回一个元素。如果我们需要知道我们的数组是否包含值,Array.find是最好的解决方案吗?可能不是,因为它返回一个值,而不是一个布尔值。使用包含对象的数组,Array.find将返回整个对象,而我们可能只需要一个布尔值。这可能会导致性能问题。对于这种情况,我建议使用Array.some,它返回所需的布尔值。

《前端精髓》

268月

Web的新图像格式WebP

238月

学习编程你要记住以下几点

如何更好地利用JavaScript数组相关推荐

  1. 这是如何更好地利用JavaScript数组的方法

    by pacdiv 由pacdiv 这是如何更好地利用JavaScript数组的方法 (Here's how you can make better use of JavaScript arrays) ...

  2. JavaScript 数组 API 全解析

    在编程世界中,数组是指元素的集合.数组将数据作为元素进行存储,并在需要时将其取出. 在支持数组的编程语言中广泛地采用了这个数据结构. 这个手册会介绍 JavaScript 数组的所有知识.你将会学到复 ...

  3. 创建零填充JavaScript数组的最有效方法?

    在JavaScript中创建任意长度的零填充数组的最有效方法是什么? #1楼 使用对象符号 var x = []; 零填充? 喜欢... var x = [0,0,0,0,0,0]; 充满" ...

  4. Javascript数组操作(转)

    1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限, ...

  5. javascript数组的各种操作

    用 js有非常久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方非常多,自以为js高手的自己竟然无从下手,一下狠心,我学 ...

  6. js跟php增加删除信息,浅谈JavaScript数组的添加和删除

    本文给大家浅谈一下JavaScript数组的添加和删除 ,有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助. 1.添加 (1)最简单的方法:为新索引赋值 (2)使用push()和unsh ...

  7. Javascript数组操作

    使用JS也算有段时日,然对于数组的使用,总局限于很初级水平,且每每使用总要查下API,或者写个小Demo测试下才算放心,一来二去,浪费不少时间:思虑下,堪能如此继续之?当狠心深学下方是正道. 原文链接 ...

  8. javaScript数组操作--有道笔记整理

    javascript之数组操作 1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一 ...

  9. 六种方法实现JavaScript数组去重

    tip:有问题或者需要大厂内推的+我脉脉哦:丛培森 ٩( 'ω' )و [本文源址:http://blog.csdn.net/q1056843325/article/details/73277063 ...

最新文章

  1. iOS 进阶 第十四天(0416)
  2. leetcode396. Rotate Function
  3. 使用Nginx代理和转发Websocket连接
  4. 深入浅出聊聊 Rust WebAssembly(一)
  5. 艾伟_转载:WPF/Silverlight陷阱:XAML自定义控件的嵌套内容无法通过名称访问
  6. 剑指offer之左旋转字符串
  7. php 管理 mysql 数据库 代码_PHP5对Mysql5的任意数据库表的管理代码示例(三)
  8. pyqt5的runJavaScript 使用模板
  9. go 怎么等待所有的协程完成_怎么关闭golang协程
  10. PHP连接 SQLSERVER 注意事项(经典中的经典)
  11. python 实现读取图片的像素值。
  12. autocomplete触发事件_如何防止onSelect事件在DevBridge jQuery Autocomplete中触发两次
  13. selenium中整个页面的截图及局部截图(方法分析)
  14. 网页中无法直接关注微信公众号怎么办?一键唤起微信关注公众号的解决方案
  15. 免费的JPEG 恢复软件 - 照片删除了怎么恢复?
  16. PS | 工作区,工具栏不见了怎么办 -- 复位基本功能
  17. 通过RSRP和SINR判断LTE信号质量
  18. 实战:使用Pytorch搭建分类网络(肺结节假阳性剔除)
  19. 手机备份到底备份什么
  20. 画圆怎么编程python,python实现画圆功能

热门文章

  1. 如何通过自动增加索引,实现数据库查询耗时降低50%
  2. 什么是数字孪生?终于有人讲明白了
  3. 家里蹲太孤单?用 Python 画一只单身狗 | 原力计划
  4. 金三银四网络面经之 DNS 详解!
  5. @程序员,入门爬虫看这一篇就够了!
  6. 防脱洗发水是个伪命题?8979 条数据告诉你答案!
  7. 从 0 经验到成为全球第一模组生产商,日海智能的「非典型」物联网之路
  8. WWDC 2019 大会前瞻:暗黑模式来袭、iOS 与 macOS 互通?
  9. 37 岁学编程,发现第一个 Bug,创造商业编程语言 | 人物志
  10. @程序员,物联网软件开发不得不克服的七大挑战