卡卡網(wǎng)

在 JavaScript 中查找數(shù)組中項(xiàng)目的索引有時(shí)非常有用，本文將介紹我們?nèi)绾稳ゲ檎覕?shù)組中項(xiàng)目的索引。

如何在JavaScript中獲取數(shù)組中項(xiàng)目的索引

在JavaScript中獲取數(shù)組中項(xiàng)目索引的最簡(jiǎn)單方法是使用Array.prototype.indexOf方法。通過(guò)在任何 JavaScript 數(shù)組上調(diào)用 indexOf ，可以為正在查找的項(xiàng)目傳遞一個(gè)參數(shù)，它將返回它的索引，或者-1（如果它找不到它）。

下面是一個(gè)示例，說(shuō)明如何使用 indexOf 在 JavaScript 中獲取數(shù)組中項(xiàng)目的索引：

const arrayExample = ["a", "b", "c", "d"]
arrayExample.indexOf("b") // 1
arrayExample.indexOf("e") // -1

輸出

正如你在這個(gè)例子中所看到的，我們所做的只是調(diào)用我們數(shù)組的 indexOf 方法并傳入我們正在尋找的項(xiàng)目。

如果找到該項(xiàng)目，則返回索引，如果找不到該項(xiàng)目，它將返回 -1，以便我們知道它沒(méi)有找到該項(xiàng)目。

使用 Array.prototype.findIndex 方法

使用indexOf適用于多種數(shù)組，但如果我們有一個(gè)稍微復(fù)雜一點(diǎn)的數(shù)組，例如對(duì)象數(shù)組，那么我們可以使用 Array.prototype.findIndex 方法。

下面是一個(gè)示例，說(shuō)明如何使用Array.prototype.findIndex方法在 JavaScript 中獲取數(shù)組中項(xiàng)目的索引： 

const arrayExample = ["a", "b", "c", "d"]
arrayExample.findIndex(arrayItem => arrayItem === "b") // 1
arrayExample.indexOf(arrayItem => arrayItem === "e") // -1

輸出

使用此方法可以讓我們創(chuàng)建自己的回調(diào)函數(shù)來(lái)檢查數(shù)組中的項(xiàng)目是否是正確的索引。

如果我們?cè)诨卣{(diào)函數(shù)中返回 true，那么 findIndex 方法將認(rèn)為該項(xiàng)目是正確的索引并將索引返回給我們。

如果我們?cè)诨卣{(diào)函數(shù)中返回 false，那么 findIndex 方法將認(rèn)為該項(xiàng)目與正在查找的項(xiàng)目不匹配，并繼續(xù)查找數(shù)組中的下一個(gè)項(xiàng)目。

如果它在數(shù)組中找不到正確的項(xiàng)目，那么它將返回-1，就像在 indexOf 方法中一樣。 

總結(jié)

本文介紹了如何在 JavaScript 中獲取數(shù)組中項(xiàng)目的索引的方法，我們可以通過(guò)2種方法來(lái)實(shí)現(xiàn)，大多數(shù)情況下使用indexOf方法，而findIndex適用于比較復(fù)雜的數(shù)組，我們可以從下文了解這兩者之間的區(qū)別：JavaScript中findIndex與indexOf 的區(qū)別。

相關(guān)文章

• JavaScript檢查對(duì)象是否數(shù)組的最快方法
• 詳細(xì)介紹5種方法檢查JavaScript對(duì)象是否數(shù)組
• 5個(gè)示例介紹如何在JS中解構(gòu)數(shù)組和對(duì)象
• 兩種簡(jiǎn)潔又安全的JS遍歷對(duì)象屬性的寫(xiě)法
• 5種方法檢查JS對(duì)象中是否存在某個(gè)鍵(屬性)
• 3種方法JS和jQuery判斷對(duì)象是否為空
• 3種方法判斷JS對(duì)象是否具有某一屬性
• 【如何合理使用】JavaScript訪問(wèn)對(duì)象屬性的3種方法
• 【實(shí)例】演示2種方法JS從對(duì)象中刪除屬性

標(biāo)簽: findIndex  indexOf