6种JavaScript判断数组是否包含某个值的方法

2023-11-17

4b0026ec47cef2791c5d31c7c86b37a8.png

我们在项目开发过程中,经常会要检查一个数组(无序)是否包含一个特定的值?这是一个在JavaScript中经常用到的并且非常有用的操作。

下面给出几种实现方式。

方式一:利用循环

这种方式是比较老的实现方案,但不可否认的是在浏览器中效率较高。

 
 
function contains(arr, val) {
    for (var i = 0; i < arr.length; i++) {
        if (arr[i] === val) {
            return true;
        }
    }
    return false;
}
contains([1,2,3],3);//true

或者使用while:

 
 
function contains(arr, val) {
    var i = arr.length;
    while (i--) {
       if (arr[i] === val){
           return true;
       }
    }
    return false;
}

方式二:使用数组的some,filter等方法

使用some方法更简洁,一旦找到元素,迭代就会中止,从而避免了不必要的迭代周期。

 
 
function contains(arr, val) {
    return arr.some(item => item === val);
}

使用filter(注意:array.filter(e=>e==x).length > 0等效于array.some(e=>e==x)但some更有效)

 
 
function contains(arr, val) {
    return arr.filter((item)=> { return item == val }).length > 0;
}

方式三:array.indexOf

array.indexOf此方法判断数组中是否存在某个值,如果存在返回数组元素的下标,否则返回-1。

 
 
[1, 2, 3].indexOf(1);//0
["foo", "fly63", "baz"].indexOf("fly63");//1
[1, 2, 3].indexOf(4);//-1

注意点:

1、indexOf() 方法对大小写敏感!如果要检索的字符串值没有出现,则该方法返回 -1。
2、在比较第一个参数与数组中的每一项时,会使用全等操作符,即要求查找的项必须严格相等
3、数组的位置是ECMAScript5为数组实例新增的,支持的浏览器有IE9+,Firefox,Safari,Opera,Chrome

方式四:array.includes

array.includes(searchElement[, fromIndex]) 此方法判断数组中是否存在某个值,如果存在返回 true,否则返回false。

它可以像这样使用:

 
 
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false

它还接受可选的第二个参数fromIndex:

 
 
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true

不像indexOf,它采用严格相等比较。这意味着您可以检测数组是否包含NaN:

 
 
[1, 2, NaN].includes(NaN); // true

也不同于indexOf,includes不会跳过缺失的索引:

 
 
new Array(5).includes(undefined); // true

方式五:array.find

find用于返回数组中满足条件的第一个元素的值,如果没有,返回undefined,比如:

 
 
let numbers = [12, 5, 8, 130, 44];
let result = numbers.find(item => {
    return item > 8;
});
console.log(result);//12
//元素是对象
let items = [
    {id: 1, name: 'something'},
    {id: 2, name: 'anything'},
    {id: 3, name: 'nothing'},
];
let item = items.find(item => {
    return item.id == 3;
});
console.log(item) //Object { id: 3, name: "nothing" }

除了find,我们也可以使用array.indIndex。返回数组中满足条件的第一个元素的索引(下标), 如果没有找到,返回-1 同第3种方法类似。

方式六、利用set中has方法

 
 
function contains(arr, val) {
  return new Set(arr).has(val)
}
contains([1,2,3],2);//true

通过new set([])将数组转换成Set对象,set.prototype.has(value)判断该值是否存在于Set对象中,返回布尔值。

延伸:除此之外,还可以利用它进行数组去重,比如:

 
 
let arr2 = new Set([1,1,2,3,4])
let arr3 = [...arr2]
console.log(arr2, arr3) // {1,2,3,4} [1,2,3,4]

学习更多技能

请点击下方公众号

b9805fb8fa3586364822a92d212d1ec3.gif

3aa66e095dc71c7e08231495e695bcba.png

ef5134a460a7a07a6dbc513229fb8ab6.png

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

6种JavaScript判断数组是否包含某个值的方法 的相关文章

  • 没有 jQuery 的纯 CSS 工具提示[重复]

    这个问题在这里已经有答案了 可能的重复 如何使用纯 CSS 创建 工具提示尾部 https stackoverflow com questions 5623072 how can i create a tooltip tail using
  • String.substring 在 Java 中到底做了什么?

    我一直想如果我这样做String s Hello World substring 0 5 然后我就得到一个新字符串s Hello Java API 文档中也记录了这一点 返回一个新字符串 该字符串是该字符串的子字符串 但当我看到下面两个链接
  • 从 DST 感知日期时间对象在 Dataframe 中创建 pandas DatetimeIndex

    我从在线 API 收集了一系列数据点 每个数据点都有一个值和一个 ISO 时间戳 不幸的是我需要循环它们 所以我将它们存储在临时的dict然后从中创建一个 pandas 数据帧并将索引设置为时间戳列 简化示例 from datetime i
  • Java 8 Streams - 嵌套映射到列表

    firstlist stream map x gt return secondList stream map y gt return a string collect Collectors toList Output I need Get
  • [PersistenceUnit:<名称>]:无法构建EntityManagerFactory

    正如主题所述 我的问题是EntityManagerFactory无法建造 我正在使用 Maven Hibernate 我正在连接到 MySQL 数据库
  • 有人让动物嗅探器插件工作吗?

    maven animal sniffer 插件承诺告诉我我的代码是否有任何对 Java 1 6 或更高版本 API 的引用 这对于我们这些在 MacOSX Snow Leopard 只有官方 1 6 上开发但需要交付到 1 5 环境的人来说
  • 使用可变参数绘制星形

    我的任务是编写程序 允许用户绘制星星 星星的大小和手臂数量可能不同 当我处理基本星时 我使用 GeneralPath 和点表进行处理 int xPoints 55 67 109 73 83 55 27 37 1 43 int yPoints
  • 在 C++ 中运行 python [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我有一个用 C 编写的应用程序和一个测试系统 也是用 C 编写的 测试系统非常复杂并且很难改变 我只想做一些小的改变 我的班级是这样的
  • 合法 .xlsx 文件上的 openpyxl load_workbook() 会导致 zipfile.BadZipFile 错误

    我试图做的是将数据帧数据附加到现有的合法 Excel 文件中 我使用了 openpyxl 中的 load workbook 函数 但它系统地返回错误 这是一些在我的机器上崩溃的代码 from openpyxl import load wor
  • 在 JavaScript 中将长数字转换为缩写字符串,并有特殊的简短要求

    在 JavaScript 中 如何编写一个函数来转换给定的 编辑 正整数 数字 低于 1000 亿 转换为 3 个字母的缩写 其中 0 9 和 a z A Z 算作一个字母 但点 因为它在许多比例字体中很小 不会 并且会被忽略信函限制条款
  • python - 从完整地址获取邮政编码

    我有一个数据框 其中一列中有完整地址 我需要创建一个仅包含邮政编码的单独列 有些地址只有五位数字的邮政编码 而其他地址则有额外的四位数字 如何拆分列以获取邮政编码 示例数据 d name bob john address 123 6th S
  • 自动打开默认电子邮件客户端并预填充内容

    当用户在页面上保存某些内容时 我需要自动打开用户的默认电子邮件客户端 我需要填充电子邮件主题 地址并在电子邮件正文中添加一些内容 实现这一目标的最佳选择是什么 我知道mailto 属性 但用户必须单击此属性 我不确定它是否允许您指定主题和内
  • Selenium WebDriver (java) 可以与浏览器的检查工具元素选择器交互吗?

    通过使用 selenium 我可以访问位于检查选项卡中的浏览器元素选择器 在浏览器中按 Ctrl Shift C 吗 我想使用该选择器 指向 一个元素 并使其在浏览器中突出显示 例如 简单的事情如下 WebElement elem driv
  • 如何以编程方式将 CSS 定义应用到整个页面?

    我确信该信息已经存在 但我找不到它 对不起 我想使用 JavaScript 创建 CSS 规则 并将它们应用到整个页面 就像它们位于文档头部的样式元素中一样 我不想通过生成 CSS 文本来实现 我想将规则保留为可以更改的实体 JavaScr
  • Angular 4 - “等待操作”的正确方法是什么?

    我遇到了一个简单的问题 有一个很奇怪的解决方案setTimeout 0 看看这个简单的代码 Component selector my app template div div
  • 阅读 setup.py 中的 README

    所以 我想要long description我的设置脚本的内容是我的README md文件 但是当我这样做时 源代码发行版的安装将失败 因为python setup py sdist不复制自述文件 有没有办法让distutils core
  • 动态插入的 jQuery 库加载完成后执行我的 jQuery 脚本

    我通过以下方式在页面上动态插入 jQuery 库
  • python函数中的Return语句不返回任何内容[重复]

    这个问题在这里已经有答案了 我不明白退货和打印之间的区别 有人告诉我应该在函数语句中使用 return 但它不会返回任何内容 所以我一直在函数中使用 print 但我想了解为什么我的函数中的 return 语句不起作用 def triang
  • a.equals(a) 什么时候返回 false?

    我想知道在哪些情况下java中的变量不能相等 使用equals 方法 自身 我这里说的不是对象而是变量本身 只要代码编译并在调用 equals 时返回 false 到目前为止 我发现的唯一情况是 public class A public
  • Spring Boot 应用程序崩溃

    请告诉我哪里有问题 我尝试启动我的第一个在 Spring Boot 上开发的应用程序 我已经在 SpringMVC 上有了简单的 Web 项目 现在我喜欢在 BOOT 上构建它 这是错误输出 org springframework bean

随机推荐

  • 关于/dev/console的个人理解

    嵌入式开发里 首先需要配置一个串口 用于打印printk信息到控制台 以2440为例 这里的 dev console 设备号 5 1 就是控制台 用于printk信息输出到的设备 但是呢 dev console是个虚拟设备 他需要映射到真正
  • 基于SpringBoot的文件在线预览神器,支持99%的文件在线预览

    kkFileView简介 kkFileView可以用来搭建文件在线预览服务 在Github上已有5 7k Star 该项目使用流行的SpringBoot搭建 易上手和部署 基本支持主流办公文档的在线预览 如docx xlsx pptx pd
  • Selenium4 新特性

    一 Selenium4 简介 Selenium是一个综合性项目 包含一系列的工具和库 支持Web浏览器的各种自动化操作 软件测试 爬虫领域 RPA领域 优点 开源 https github com SeleniumHQ 兼容性 Chrome
  • 《动手学ROS2》10.1 机器人自主导航技术概述

    动手学ROS2 10 1 机器人自主导航技术概述 本系列教程作者 小鱼 公众号 鱼香ROS QQ交流群 139707339 教学视频地址 小鱼的B站 完整文档地址 鱼香ROS官网 版权声明 如非允许禁止转载与商业用途 10 1 机器人自主导
  • 【华为OD机试真题c++/java/python】云短信平台优惠活动【 2023 Q1

    华为OD机试 题目列表 2023Q1 点这里 2023华为OD机试 刷题指南 点这里 题目描述 某云短信厂商 为庆祝国庆 推出充值优惠活动 现在给出客户预算 和优惠售价序列 求最多可获得的短信总条数 输入描述 第一行客户预算M 其中 0 M
  • 剑指 Offer 13. 机器人的运动范围&剑指 Offer 12. 矩阵中的路径---dfs题目的应对策略

    列举剑指 Offer有关dfs的两道初级题目 来谈谈这种题的自己的心得 剑指 Offer 13 机器人的运动范围 class Solution public int movingCount int m int n int k boolean
  • stata中计算公式命令_stata学习笔记(三):计算五年内的ROA标准差所用到的一些知识...

    1 如何删除某几行的数据 drop if year2 2014 year2 2013 2 如何计算连续几年的标准差 year2为int型 bys stkcd year2 gen roa1 adjroa n 1 bys stkcd year2
  • JavaScript 使用对象字面量创建对象、使用new Object创建对象

    博主前些天发现了一个巨牛的人工智能学习网站 通俗易懂 风趣幽默 忍不住也分享一下给大家 点击跳转到网站 前言 一 使用对象字面量创建对象 对象字面量 就是花括号 里面包含了表达这个具体事物 对象 的属性和方法 里面采取键值对的形式表示 键
  • 新手怎么在GitHub上传代码?----最新教程

    准备工作 注册github账号 https github com 本地电脑先安装git工具 下载后可一直点下一步 https git for windows github io Git工具中粘贴用 Shift Insert 文件上传 1 进
  • Failed to configure a DataSource: ‘url‘ attribute is not specified and no embedd(究极踩坑完美解决)

    前言 Failed to configure a DataSource url attribute is not specified and no embedd这个错误想必大家已经非常非常熟悉了 关于数据库配置的问题 但是这种错误还有一种坑
  • 2017服务器cpu性能排行,CPU性能怎么看?桌面CPU天梯图2017年12月最新版

    马上注册 结交更多好友 享用更多功能 您需要 登录 才可以下载或查看 没有帐号 注册 x 本帖最后由 哼哈二将 于 2018 4 10 13 44 编辑 CPU性能怎么看 桌面CPU天梯图2017年12月最新版 今天是12月11日 每个月本
  • 【翻译】如何使混合型会议不至于太糟糕

    混合会议又回来了 人们正在享受它们 并发现它们很有用 这是犹他大学的会议科学家约瑟夫 艾伦博士的新研究的惊人发现 这个发现让艾伦博士感到惊讶 当然也让我感到惊讶 像大多数远程团队工作的专家一样 我长期以来一直建议采用 一个远程 所有远程 的
  • 使用Arduino开发ESP32(17):固件更新演示

    文章目录 目的 基础说明 使用演示 通过SD卡更新固件 通过网页更新固件 总结 目的 很多时候我们会有因为bug修复 功能增加等情况需要对已投产使用的设备更新固件 这种情况下再使用工具通过串口烧录固件就不是那么方便了 比较常用的是通过网络或
  • 分享一下

    链接 https pan baidu com s 1RxTElM9DLqSjhKeWPY Ww 提取码 hwsv
  • iframe子页面获取父页面控件赋值时报错Uncaught SyntaxError: Invalid or unexpected token

    在父页面嵌入了一个iframe来实现上传图片 上传成功后获取父页面的一个input并把图片保存路径赋值给它 这是我之前在ssh里面的写法 是可以的 但是拿过来用就不行了 通过浏览器调试发现报错 Uncaught SyntaxError In
  • MySQL监控和预警

    1 摘要 本人从事Java Web开发 在项目开发中会用到很多中间件 本文主要介绍MySQL监控的一点心得和使用 公司DBA也有相应的监控 但是我们的业务比较重要 想做一个备份监控 对MySQL监控需要做监控和预警 首先需要有数据 数据采集
  • Android进阶宝典 -- 插件化1(加载插件中类)

    什么是插件化 插件化对于Android应用能起到什么好处 可能对于插件化不熟悉的伙伴们都会有这个疑问 或许你在项目中已经遇到过这个问题 只不过是不知道需要采用什么样的方式去解决 我们看下面这个场景 一个应用主模块20M 其他3个模块可以看做
  • 国王和金矿问题

    国王和金矿问题 描述 有一个国家发现了max n座金矿 参与挖矿工人的总数是max people人 每座金矿的黄金储量不同为一维数组gold 需要参与挖掘的工人数也不同为一维数组peopleNeed 每座金矿要么全挖 要么不挖 不能派出一半
  • python爬虫学习笔记-CSS(大致了解)

    CSS中文译作 层叠样式表 或者是 级联样式表 是用于控制网页外观处理并允许将网页的表现与内容分离的一种标记性语言 CSS不需要编译 可以直接由浏览器执行 属于浏览器解释型语言 是Web网页开发技术的重要组成部分 那么接下来 继续看下 使用
  • 6种JavaScript判断数组是否包含某个值的方法

    我们在项目开发过程中 经常会要检查一个数组 无序 是否包含一个特定的值 这是一个在JavaScript中经常用到的并且非常有用的操作 下面给出几种实现方式 方式一 利用循环 这种方式是比较老的实现方案 但不可否认的是在浏览器中效率较高 fu