js findIndex方法

本文介绍了JavaScript数组的findIndex和find方法,它们用于查找满足条件的元素。findIndex返回满足条件的第一个元素的索引,而find返回满足条件的元素本身。这两个方法都不会改变原数组,且在找到匹配项后停止遍历剩余元素。示例代码展示了如何在不同场景下使用这两个方法。
摘要由CSDN通过智能技术生成

findIndex方法常用来查找数组中满足条件的第一项元素的下标

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

// 可以这么写

const index = arr.findIndex(item => {
    return item > 2
})

console.log(index) // 2

// 也可以这么写

const index = arr.findIndex(item => item > 2)

console.log(index) // 2

返回的index是满足条件的第一项元素的下标,这要注意的是findIndex会给数组中的每一项执行一个函数来判断是否满足表达式,如果满足条件后,剩下的元素则不再执行

查找数组中满足条件的某一项,并且返回那一项对应的值可以用find方法

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

    const val = arr.find(item => {
      return item.age === 20
    })
    
    // 还可以这么写
    const val = arr.find(item => item.age === 20)
    console.log(val)  
     // {
            name: '李四',
            age: 20
        }

和findIndex一样,返回满足条件的值,并且不检测剩余值,只不过findIndex返回的是下标,find方法是返回满足条件的那一个元素,具体怎么使用看场景需要

注:两个方法都不会改变原数组

JavaScript中的findIndex方法是用来查找数组中满足条件的第一个元素的索引。它接受一个回调函数作为参数,这个回调函数用来判断数组中的每一个元素是否满足条件。如果找到满足条件的元素,则返回它的索引值;如果没有找到满足条件的元素,则返回-1。 例如,如果我们有一个数组arr = [1, 2, 3, 4, 5, 3, 3, 2, 4, 5],我们可以使用findIndex方法来查找大于2的第一个元素的索引。可以这样写: ```javascript const index = arr.findIndex(item => { return item > 2 }) console.log(index) // 输出 2 ``` 我们也可以简化回调函数的写法: ```javascript const index = arr.findIndex(item => item > 2) console.log(index) // 输出 2 ``` 除了findIndex方法外,JavaScript中还有find方法,它与findIndex方法类似,但返回的是满足条件的元素本身,而不是索引。具体使用哪个方法取决于你的需求。 总结来说,JavaScript中的findIndex方法用于查找数组中满足条件的第一个元素的索引,它在处理类似情况时非常有用。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [js findIndex方法](https://blog.csdn.net/Polohert/article/details/124386464)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [JS中findIndex方法的使用场景以及与find的差别](https://blog.csdn.net/ONLYSRY/article/details/128127428)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值