JavaScript查找數(shù)組中指定元素的索引的方法小結(jié)

更新時間：2026年01月19日 09:21:36 作者：Never_Satisfied

這篇文章主要介紹了JavaScript中查找數(shù)組元素索引的五種方法：indexOf()、lastIndexOf()、findIndex()、findLastIndex()和手動循環(huán),每種方法都有其適用場景和返回值,手動循環(huán)在性能上可能更優(yōu),選擇時應(yīng)考慮具體需求和數(shù)組大小,需要的朋友可以參考下

1. indexOf() - 查找簡單值

const arr = ['apple', 'banana', 'orange', 'banana'];

// 查找第一個匹配項的索引
console.log(arr.indexOf('banana')); // 1

// 查找不存在的元素
console.log(arr.indexOf('grape')); // -1

// 從指定位置開始查找
console.log(arr.indexOf('banana', 2)); // 3

2. lastIndexOf() - 從后往前查找

const arr = ['apple', 'banana', 'orange', 'banana'];

console.log(arr.lastIndexOf('banana')); // 3
console.log(arr.lastIndexOf('banana', 2)); // 1

3. findIndex() - 使用回調(diào)函數(shù)查找

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

// 查找第一個滿足條件的元素索引
const index = users.findIndex(user => user.name === 'Bob');
console.log(index); // 1

// 查找年齡大于25的用戶索引
const ages = [18, 22, 30, 45];
const ageIndex = ages.findIndex(age => age > 25);
console.log(ageIndex); // 2

4. findLastIndex() - 從后往前使用回調(diào)函數(shù)查找

const numbers = [1, 2, 3, 4, 3, 5];

// 從后往前查找第一個滿足條件的元素索引
const lastIndex = numbers.findLastIndex(num => num === 3);
console.log(lastIndex); // 4

5. 手動循環(huán)實現(xiàn)

function findIndexCustom(arr, value) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === value) {
      return i;
    }
  }
  return -1;
}

const arr = ['a', 'b', 'c'];
console.log(findIndexCustom(arr, 'b')); // 1
console.log(findIndexCustom(arr, 'd')); // -1

實際應(yīng)用示例

// 查找對象數(shù)組中的特定元素
const products = [
  { id: 1, name: 'Laptop', price: 1000 },
  { id: 2, name: 'Phone', price: 500 },
  { id: 3, name: 'Tablet', price: 300 }
];

// 查找價格低于400的產(chǎn)品索引
const cheapProductIndex = products.findIndex(product => product.price < 400);
console.log(cheapProductIndex); // 2

// 查找所有匹配項的索引
function findAllIndexes(arr, value) {
  const indexes = [];
  let currentIndex = -1;
  
  while ((currentIndex = arr.indexOf(value, currentIndex + 1)) !== -1) {
    indexes.push(currentIndex);
  }
  
  return indexes;
}

const fruits = ['apple', 'banana', 'apple', 'orange', 'apple'];
console.log(findAllIndexes(fruits, 'apple')); // [0, 2, 4]