JS判断是否存在某个元素(includes、indexOf、find、findeIndex、some)(every 数组内所有值是否相同)

news2024/9/27 7:26:26

  方法一:array.includes(searcElement[,fromIndex])

 此方法判断数组中是否存在某个值,如果存在返回true,否则返回false

  • searchElement:需要查找的元素,必选。
  • fromIndex:可选,从该索引处开始查找元素。如果省略该参数,则从数组的头开始查找。如果 fromIndex 大于或等于数组长度,则返回 false。
const numbers = [1, 2, 3, 4, 5]

console.log(numbers.includes(3)) // true
console.log(numbers.includes(6)) // false

如果想要检查数组中是否包含某个对象,可以使用 some() 方法

const users = [
  { name: '张三', age: 20 },
  { name: '李四', age: 18 },
  { name: '王五', age: 35 }
]

const user = { name: '李四', age: 18 }

const isUserIncluded = users.some(u => u.name === user.name && u.age === user.age)

console.log(isUserIncluded) //true

 具体some()方法见下文。

 方法二: array.indexOf

 indexOf 不存在返回-1,存在返回第一次出现的索引

array.indexOf(item,start) 

参数说明: 

item:必须。查找的元素。 

start:可选的整数参数。规定在字符串中开始检索的位置。

它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

var arr = [1, 2, 3, 9, 8, 7]
if(arr.indexOf(5) === -1){
  console.log("不存在")
}
if (arr.indexOf(9) > -1){
  console.log("存在,索引是:", arr.indexOf(9))
}

 

注意:string.indexOf()返回某个指定的字符串值在字符串中首次出现的位置。

1.该方法将从头到尾地检索字符串 stringObject,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一次出现的位置。 
2. stringObject 中的字符位置是从 0 开始的。 
3. 查找字符串最后出现的位置,使用 lastIndexOf() 方法。

方法三:array.find(callback[, thisArg])

它的参数是一个回调函数,所有数组元素依次遍历该回调函数,直到找出第一个返回值为true的元素,然后返回该元素,否则返回undefined

find() 方法为数组中的每个元素都调用一次函数执行:

  • 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
  • 如果没有符合条件的元素返回 undefined 
    注意: find() 对于空数组,函数是不会执行的。 
    注意: find() 并没有改变数组的原始值。

// 返回第一个大于9的元素 // 10
[1, 5, 10, 15].find(function(value, index, arr) {
    return value > 9
})

 

// 查找 2, find会找出所有存在的 2 以及索引
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2]
arr.find(function(value, index, arr) {
  if(value === 2 ) {
    console.log("存在, 索引为:", index)    
  }
})

 

 方法四:array.findeIndex(callback[, thisArg])

 array.findIndex()和array.find()十分类似,返回第一个符合条件的数组元素的位置,如果所有元素都不符合条件,则返回-1。 
findIndex() 方法为数组中的每个元素都调用一次函数执行:

        当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。 
        如果没有符合条件的元素返回 -1。

注意: findIndex() 对于空数组,函数是不会执行的。 
注意: findIndex() 并没有改变数组的原始值。

// 返回第一个大于9的元素的索引 // 2
[1, 5, 10, 15].findIndex(function(value, index, arr) {
    return value > 9
})

 如果没有符合条件的元素返回 -1:

//  如果没有符合条件的元素返回 -1
[1, 5, 10, 15].findIndex(function(value, index, arr) {
    return value > 20
})

 array.findIndex() 和 array.find(),这两个方法都可以发现NaN,弥补了array.indexOf()的不足。

[NaN].indexOf(NaN) // -1

[NaN].findIndex(y => Object.is(NaN, y)) // 0

 

 方法五:array.some(callback[, thisArg])

some方法同样用于检测是否有满足条件的元素,如果有,则不继续检索后面的元素,直接返回true,如果都不符合,则返回一个false

参数说明:

  • array:必需参数,一个数组对象。

  • callbackfn:必需参数,一个接收量最多三个参数的函数。函数参数:

    参数描述
    currentValue必须。当前元素的值
    index可选。当前元素的索引值
    arr可选。当前元素属于的数组对象

    some() 方法会为 array 中的每个元素调用 callbackfn 函数,直到 callbackfn 返回 true,或直到到达数组的结尾。

  • thisArg:可选参数,可在 callbackfn 函数中为其引用 this 关键字的对象。如果省略 thisArg,则 undefined 将用作返回 false。

注意:

(1)some()方法不会对空数组进行检测

(2)some()方法不会改变原始数组

示例:

let arr = [1, 2, 3, 4, 5]

let result = arr.some(el => el === 3) 
console.log(result) //true
if (result) {
  //do something...
}

const arr = [1, 2, 3, 4, 5]
const res = arr.some(item => item < 0)
console.log(res) // false

题外话: array.every(function(currentValue,index,arr), thisValue)

提到some()就不得不提到every():

  • every()方法用于检测数组中的所有元素是否都满足指定条件(该条件为一个函数)。
  • every()方法会遍历数组的每一项,如果有有一项不满足条件,则表达式返回false,剩余的项将不会再执行检测。如果遍历完数组后,每一项都符合条,则返回true

参数说明:

  • 第一个参数为一个回调函数,必传,数组中的每一项都会遍历执行该函数。
    currentValue:必传,当前项的值
    index:选传,当前项的索引值
    arr:选传,当前项所属的数组对象
  • 第二个参数thisValue为可选参数,回调函数中的this会指向该参数对象。

注意:

  • every() 不会对空数组进行检测
  • every() 不会改变原始数组
// 数组中的每个元素的值都要大于20的情况,最后才返回true
var arr = [10, 20, 30]
var flag = arr.every(function (a, b, c) {
    return a > 20
})
console.log(flag) //false

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1223416.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

挑战视觉边界,探索图形验证码背后的黑科技

在日常生活中&#xff0c;我们登录网站或者其他平台时&#xff0c;在填写完账号密码之后&#xff0c;还会让我们填写4或6位的数字或者英文字母等&#xff0c;填写正确才能请求登录。这个其实是防止某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试&#xff0c;如下…

【LearnOpenGL基础入门——3】绘制纯色三角形

目录 一.写在前面 二.顶点输入 三.顶点着色器 四.编译着色器 五.片段着色器 六.着色器程序 七.链接顶点属性 彩蛋 一.写在前面 我们先认识一下OpenGL常用的几个名词&#xff1a; 顶点数组对象&#xff1a;Vertex Array Object&#xff0c;VAO顶点缓冲对象&#xff1a;…

Unity之NetCode多人网络游戏联机对战教程(9)--NetworkAnimator组件

文章目录 前言NetworkAnimatorAnimator的Trigger属性服务器权威模式&#xff08;Server Authoritative Mode&#xff09;客户端权威模式 (Owner Authoritative Mode)学习文档 前言 这个组件是NetCode常用的组件之一&#xff0c;NetworkAnimator跟NetworkTransform一样&#xf…

VSG-001

VulkanSceneGraph (VSG), is a modern, cross platform, high performance scene graph library built upon Vulkan VSG 是一个基于vulkan的现代的、跨平台的高性能场景管理库 VSg特性&#xff1a; 使用C17作为c规范编码&#xff0c;支持 CppCoreGuidelines支持 FOSS Best P…

Google Chrome 任意文件读取 (CVE-2023-4357)漏洞复现

Google Chrome 任意文件读取 (CVE-2023-4357)漏洞复现 1.漏洞描述 该漏洞的存在是由于 Google Chrome 中用户提供的 XML 输入验证不足。远程攻击者可以创建特制网页&#xff0c;诱骗受害者访问该网页并获取用户系统上的敏感信息。远程攻击者可利用该漏洞通过构建的 HTML 页面…

Leetcode——最长递增子序列

1. 题目链接&#xff1a;300. 最长递增子序列 2. 题目描述&#xff1a; 给你一个整数数组 nums &#xff0c;找到其中最长严格递增子序列的长度。 子序列 是由数组派生而来的序列&#xff0c;删除&#xff08;或不删除&#xff09;数组中的元素而不改变其余元素的顺序。例如&a…

基于秃鹰算法优化概率神经网络PNN的分类预测 - 附代码

基于秃鹰算法优化概率神经网络PNN的分类预测 - 附代码 文章目录 基于秃鹰算法优化概率神经网络PNN的分类预测 - 附代码1.PNN网络概述2.变压器故障诊街系统相关背景2.1 模型建立 3.基于秃鹰优化的PNN网络5.测试结果6.参考文献7.Matlab代码 摘要&#xff1a;针对PNN神经网络的光滑…

Android Fragment 要你何用?2.0版本

作者&#xff1a;小鱼人爱编程 1. 老生常谈&#xff1a;为什么需要Fragment? 先看Activity、Fragment、View三者的关系&#xff1a; Activity 拥有生命周期&#xff0c;但是需要和AMS通信(跨进程)&#xff0c;比较臃肿。 View 不需要和AMS通信&#xff0c;但没有生命周期&…

机器学习第9天:决策树分类

文章目录 机器学习专栏 介绍 基本思想 使用代码 深度探索 优点 估计概率 训练算法 CART成本函数 实例数与不纯度 正则化 在鸢尾花数据集上训练决策树 机器学习专栏 机器学习_Nowl的博客-CSDN博客 介绍 作用&#xff1a;分类 原理&#xff1a;构建一个二叉树&#…

Aerial for Mac: 沉浸在高清鸟瞰的世界,让你的屏幕焕发新生

你是否已经厌倦了那些平淡无奇的屏保程序&#xff1f;是否希望你的Mac屏幕能更生动、更有趣&#xff1f;如果你对此抱有强烈的期待&#xff0c;那么Aerial for Mac绝对会是你期待已久的解决方案。 Aerial for Mac是一款独具特色的高清屏保程序&#xff0c;它以鸟瞰的视角带你领…

MyBatis查询数据库(全是精髓)

1. 什么是MyBatis&#xff1f; 简单说&#xff0c;MyBatis就是一个完成程序与数据库交互的工具&#xff0c;也就是更简单的操作和读取数据库的工具。 2. 怎么学习Mybatis Mybatis学习只分为两部分&#xff1a; 配置MyBatis开发环境使用MyBatis模式和语法操作数据库 3. 第一…

【广州华锐互动】VR技术助力中小学生安全教育,让学生在虚拟世界中学会自我保护!

随着科技的不断发展&#xff0c;虚拟现实&#xff08;VR&#xff09;技术已经逐渐走进我们的生活。在教育领域&#xff0c;VR技术的应用也日益广泛&#xff0c;为传统的教育模式带来了革命性的变革。中小学生安全教育作为学生生活中的重要组成部分&#xff0c;其重要性不言而喻…

PyTorch 实战之水果分类

当我们试图提高神经网络的准确性时&#xff0c;经常会遇到过拟合训练数据的情况。当我们运行测试数据的模型时&#xff0c;这会导致一个糟糕的预测。因此&#xff0c;我采取了一个数据集&#xff0c;并应用这些技术&#xff0c;不仅提高准确性&#xff0c;而且还处理过拟合的问…

2023-11-17 VsCode使用makefile进行多文件编译

点击 <C 语言编程核心突破> 快速C语言入门 VsCode使用makefile进行多文件编译 前言一、一个简单的多文件示例二、makefile基本语法三、VsCode使用makefile总结 前言 要解决问题: C或C可以多文件编译, 意味着需要进行代码组织, 为了方便多文件编译, gnu开发了make工具, …

【Gradle构件工具深度学习】

Gradle构件工具深度学习 1. 课程大纲1.1 Gradle入门1.2 与Idea整合1.3 Gradle进阶 2. 常见项目构建工具3. 安装gradle 1. 课程大纲 1.1 Gradle入门 基本介绍、常用指令、项目目录、项目应用 1.2 与Idea整合 Groovy语法、整合IDEA、搭建web工程、项目部署 1.3 Gradle进阶 生命周…

Linux 进程管理 实时调度类及SMP和NUMA

文章目录 一、 实时调度类分析1.1 实时调度实体sched_rt_entity数据结构1.2 实时调度类rt_sched_class数据结构1.3 实时调度类功能函数 二、SMP和NUMA2.1 SMP&#xff08;多对称处理器结构&#xff0c;UMA&#xff09;2.2 NUMA&#xff08;非一致内存访问结构&#xff09;2.3 C…

验证码案例 —— Kaptcha 插件介绍 后端生成验证码,前端展示并进行session验证(带完整前后端源码)

&#x1f9f8;欢迎来到dream_ready的博客&#xff0c;&#x1f4dc;相信你对这篇博客也感兴趣o (ˉ▽ˉ&#xff1b;) &#x1f4dc;表白墙/留言墙 —— 中级SpringBoot项目&#xff0c;MyBatis技术栈MySQL数据库开发&#xff0c;练手项目前后端开发(带完整源码) 全方位全步骤手…

4.6 Windows驱动开发:内核遍历进程VAD结构体

在上一篇文章《内核中实现Dump进程转储》中我们实现了ARK工具的转存功能&#xff0c;本篇文章继续以内存为出发点介绍VAD结构&#xff0c;该结构的全程是Virtual Address Descriptor即虚拟地址描述符&#xff0c;VAD是一个AVL自平衡二叉树&#xff0c;树的每一个节点代表一段虚…

计算机网络学习笔记(六):应用层(待更新)

目录​​​​​​​ 6.2 文件传送协议FTP(File Transfer Protocol) 6.2.1 FTP概述 6.2.2 FTP的基本工作原理 6.5 电子邮件&#xff1a;SMTP、POP3、IMAP 6.5.1 电子邮件概述 6.5.2 发邮件&#xff1a;简单邮件传送协议SMTP 6.5.3 电子邮件的信息格式、地址格式 6.5.4 收…

Python语言:随机生成几个数案例分析讲解

背景 在某一节课上&#xff0c;老师使用xx通软件随机生成几个学号&#xff0c;并让对应学号同学回答问题。虽然我对xx通软件没啥好感&#xff0c;不过感觉这个随机生成学号功能挺不错的。今天我用python实现一个这个功能。 其实原理挺简单的&#xff0c;就是就是在一堆数字里随…