首页 > 其他分享 >js 搜索和位置方法

js 搜索和位置方法

时间:2024-01-13 20:01:23浏览次数:37  
标签:includes indexOf 位置 alert 搜索 numbers 数组 js

ECMAScript 提供两类搜索数组的方法:按严格相等搜索和按断言函数搜索。

1. 严格相等:

ECMAScript 提供了 3 个严格相等的搜索方法:indexOf()、lastIndexOf()和 includes()。其 中,前两个方法在所有版本中都可用,而第三个方法是 ECMAScript 7 新增的。这些方法都接收两个参 数:要查找的元素和一个可选的起始搜索位置。indexOf()和 includes()方法从数组前头(第一项) 开始向后搜索,而 lastIndexOf()从数组末尾(最后一项)开始向前搜索。

indexOf()和 lastIndexOf()都返回要查找的元素在数组中的位置,如果没找到则返回1。 includes()返回布尔值,表示是否至少找到一个与指定元素匹配的项。在比较第一个参数跟数组每一 项时,会使用全等(===)比较,也就是说两项必须严格相等。下面来看一些例子:

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
    alert(numbers.indexOf(4));
    alert(numbers.lastIndexOf(4));
    alert(numbers.includes(4));
    alert(numbers.indexOf(4, 4));
    alert(numbers.lastIndexOf(4, 4));
    alert(numbers.includes(4, 7));
    let person = { name: "Nicholas" };
    let people = [{ name: "Nicholas" }];
    let morePeople = [person];
    alert(people.indexOf(person));
    alert(morePeople.indexOf(person));  // 0
    alert(people.includes(person));     // false
    alert(morePeople.includes(person)); // true

2. 断言函数:

ECMAScript 也允许按照定义的断言函数搜索数组,每个索引都会调用这个函数。断言函数的返回 值决定了相应索引的元素是否被认为匹配

断言函数接收 3 个参数:元素、索引和数组本身。其中元素是数组中当前搜索的元素,索引是当前 元素的索引,而数组就是正在搜索的数组。断言函数返回真值,表示是否匹配。

find()和 findIndex()方法使用了断言函数。这两个方法都从数组的最小索引开始。find()返回 第一个匹配的元素,findIndex()返回第一个匹配元素的索引。这两个方法也都接收第二个可选的参数, 用于指定断言函数内部 this 的值。

const people = [
      {
        name: "Matt",
age: 27 },
      {
        name: "Nicholas",
        age: 29
} ];
alert(people.find((element, index, array) => element.age < 28)); // {name: "Matt", age: 27}
alert(people.findIndex((element, index, array) => element.age < 28)); // 0

标签:includes,indexOf,位置,alert,搜索,numbers,数组,js
From: https://blog.51cto.com/u_16251183/9233115

相关文章

  • js slice()函数
    不包括"red",这是因为拆分操作要从位置1开始,即从"green"开始。得到的colors2数组包含1"green"、"blue"、"yellow"和"purple"。colors3数组是通过调用slice()并传入1和4得到的,即从位置1开始复制到位置3。因此colors3包含"green"、"blue"和&......
  • js 操作方法
    如果数组的元素是数值,或者是其valueOf()方法返回数值的对象(如Date对象),这个比较函数还可以写得更简单,因为这时可以直接用第二个值减去第一个值:functioncompare(value1,value2){returnvalue2-value1;}比较函数就是要返回小于0、0和大于0的数值,因此减法操作完......
  • VUE快速改造前端高级搜索
    更新说明:支持本地存储,默认1天,7天支持当字段少于2个,自动隐藏“展开”按钮增加时间组件、时间范围组件简化组件代码不影响自动代码生成的搜索条件,不影响其他代码逻辑截图步骤如果部分代码,无法复制,可以参考:src/views/purchase/cgreturn/index.vue每个列表Index界面,都有搜索,将<a-form>(......
  • JS常用工具:Webpack 和 JShaman分别有什么用?
    Webpack和JShaman是两个不同的工具,它们的特点和用途也不同。Webpack是一个前端资源模块打包工具,主要用于将各种静态资源(如JavaScript、CSS、图片等)视为模块,并将其打包成浏览器可以识别的代码。Webpack的特点包括:1.模块化:Webpack将各种资源视为模块,使开发者能够更好地组织和管理项......
  • 【LeetCode 2701. 连续递增交易】MySQL用户变量编程得到严格递增连续子序列的开始位置
    题目地址https://leetcode.cn/problems/consecutive-transactions-with-increasing-amounts/代码#WriteyourMySQLquerystatementbelowwitht1as(select*#--------------------------只需要改动这里的逻辑,其他不要动。注意里面的语句是“顺序执行的......
  • GitHub常用搜索技巧
    普通关键词搜索搜索关键词为javascript的所有项目,可以搜索到数量为2百万的项目,数量庞大,不利于筛选。高级搜索(添加限定词)搜索写法含义in:nameXXX按照项目(仓库)名称搜索in:descriptionXXX按照项目(仓库)描述搜索in:readmeXXX按照README文件搜索languag......
  • JS常用工具:Webpack 和 JShaman分别有什么用?
    Webpack和JShaman是两个不同的工具,它们的特点和用途也不同。Webpack是一个前端资源模块打包工具,主要用于将各种静态资源(如JavaScript、CSS、图片等)视为模块,并将其打包成浏览器可以识别的代码。Webpack的特点包括:1.模块化:Webpack将各种资源视为模块,使开发者能够更好地组织和管理......
  • springboot mybatis postgres 对于json类型的字段转换
    在SpringBoot与MyBatis结合使用时,处理PostgreSQL中的JSON类型字段的转换可以分为以下步骤:自定义TypeHandler:为了在Java实体类与数据库的JSON类型字段之间进行转换,需要创建一个自定义的 TypeHandler。例如,针对JSONObject类型的转换器可以这样实现:importorg.apache.ibatis.type.B......
  • 这一次,弄明白JS中的文件相关(一):概念篇
    概念是学习的基础。在学习JS中的文件操作之前,先把文件相关的各种概念搞清楚,很有好处。 1.二进制:计算机硬件仅能处理和存储二进制数据,所以不管是你正在写的代码,还是你硬盘里的小姐姐,都是以二进制的形式存储于电脑的内存和硬盘里的。2.编码规则:二进制计算机看得懂,我们看......
  • playwright获取B站搜索信息
    简介使用自动化工具playwright根据输入关键词,获取b站所有的搜索结果的视频标题,视频链接。一、css观察网页结构,右键进入检查页获取css定位。先填充查找信息后点击搜索。page.locator(".nav-search-input").fill(msg)page.locator(".nav-search-btn").click()进入到搜索界面后,同样......