indexOf与includes区别

news/2024/7/15 18:15:39 标签: 前端, javascript, react.js
判断字符串或者数组中是否存在对应元素

indexOf: 查找字符串中某个字符或字符串下表的位置,找到返回第一次出现的下标, 未找到返回-1

// 不传递第二个参数: 默认从0开始
[1,2,3,4,5].indexOf(3);  // 查找字符3,找到返回3所在的下标,即为2

延申:

// 第一个参数要查找的, 第二个参数从哪个索引开始
[1,2,3,4,5].indexOf(3, 1);  // 查找字符3,从索引1开始找直到最后,  字符3在索引2的位置,所以能找到3, 返回索引值2


//从索引值为2的地方开始查找值为1,找不到返回-1,找到返回索引值
[1,2,3,4,5].indexOf(2,1);// -1

//'-'代表需要从后往前  在这里:-1指向字符4、-2->3......以此类推
//从4(索引值为-1)的位置开始寻找2
[1,2,3,4].indexOf(2,-1);// -1



 includes:判断一个字符串是否包含另外一个字符串,包含返回true, 否则false

 // 第一个参数:需要查找的元素,  第二个参数查找的起始索引,不写默认从0开始
[1,2,3,4,5].includes(2); // true

延申:

 // 判断字符串2,是否在数组里,从索引为1开始向右查找直到最后,字符串2在索引1的位置
[1,2,3,4,5].includes(2,1);// true

 //从5(索引值为-1)的位置开始向右寻找2,找不到,返回false
 [1,2,3,4,5].includes(2,-1);// false

 //从索引值为-3的位置开始寻找字符c, 索引-3对应数组字符串c的位置。e-> -1, d-> -2, c-> -3
 [a,b,c,d,e].includes(c,-3);// true

 NaN、undefined 的处理:
indexoOf():不能匹配到数组中的NaN
includes():能匹配到数组中的NaN

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


[1,2,undefined].indexOf(undefined);// -1
[1,2,undefined].includes(undefined);// true

相同点:


方法的基本调用:第一个参数:要查找的元素;第二个参数:position从哪个索引值开始查找

不同点:

数据类型转换:

        字符串在执行匹配的时候:进行类型转换

        数组在执行匹配的时候:严格相等匹配(===)

'12345'.indexOf(2);   // 1  会进行数据类型转换
'12345'.includes(2);  // true


['1','2','3','4','5'].indexOf(2);   // -1   不会进行数据类型转换
['1','2','3','4','5'].includes(2);  // false

应用:

        因为includes,返回是布尔类型true、false,可用于控制某个功能的显隐。

        因为indexOf,返回是索引、-1,可用于判断某个值是否在数组里


http://www.niftyadmin.cn/n/5230300.html

相关文章

scrapy介绍,并创建第一个项目

一、scrapy简介 scrapy的概念 Scrapy是一个Python编写的开源网络爬虫框架。它是一个被设计用于爬取网络数据、提取结构性数据的框架。 Scrapy 使用了Twisted异步网络框架,可以加快我们的下载速度。 Scrapy文档地址:http://scrapy-chs.readthedocs.io/z…

Arkts开发UIAbility组件生命周期启动模式开发详解【鸿蒙专栏-19】

文章目录 HarmonyOS UIAbility组件详解UIAbility组件概述声明配置UIAbility组件生命周期Create状态WindowStageCreate和WindowStageDestroy状态Foreground和Background状态Destroy状态UIAbility组件启动模式Singleton启动模式Standard启动模式Specified启动模式HarmonyOS UIAbi…

rust持续学习 COW

COW我第一次看见还以为是奶牛 很奇怪是个啥 后来了解到是clone on write 缩写的,大乌龙啊 这个有两种enum,一种是borrow,一种是own rust中,数据读写经常涉及到所有权 这个borrow,很显然,就是不可变借用了 own就是可以写…

AI生成的图片有版权了

我是卢松松,点点上面的头像,欢迎关注我哦! 把发到小红书的AI图片搬运到百家号,然后被起诉了! 长知识了,原来AI生成的图片也有版权了,AI生成图片著作权第一案判了,这绝对是一件划时代事情&…

【Java进阶】-- 设计模式

一、什么是设计模式? Java 设计模式是一种在Java编程中广泛使用的软件设计范例。它们提供了一种解决常见设计问题的方法,并且可以帮助开发人员编写易于维护和扩展的代码。 二、为什么要有设计模式? 使用设计模式是为了可重用代码、让代码更容…

圆通速递查询,圆通速递单号查询,批量复制查询好的物流信息

圆通速递单号物流信息查询,批量复制查询好的物流信息。 所需工具: 一个【快递批量查询高手】软件 圆通速递单号若干 操作步骤: 步骤1:运行【快递批量查询高手】软件,第一次使用的朋友记得先注册,然后登录…

万宾科技监测设备,可燃气体监测仪特点一览

万宾科技的监测设备种类繁多,包括可燃气体监测仪、管网水位监测仪、内涝积水监测仪等。其中可燃气体监测仪是万宾科技的核心产品之一,用于监测环境中可燃气体的浓度,适用于对甲烷气体浓度进行实时监测,应用于燃气管网、排水管网、…

WT2605-24SS高品质录音语音芯片:实现五种变音效果,为音频应用增添无限创意

在音频技术的世界里,录音芯片作为声音处理和传输的核心部件,一直以来都承载着人们对高品质音频的追求。而唯创知音推出的WT2605-24SS高品质录音语音芯片则在此基础上更进一步,带来了五种独特的变音效果,为音频应用注入了无限的创意…