数组07— index() ：在数组中定位一个元素

在上节，我们学习了JavaScript 数组 slice() 方法的实际用途，错过的小伙伴可以点击文章《【JavaScript 教程】第六章 数组06— slice() ：复制数组元素》进行学习。

那么，在今天的教程中，我们一起来学习如何使用 JavaScript 数组 indexOf() 和 lastIndexOf() 方法来查找数组中元素的位置。

JavaScript 数组 indexOf() 方法介绍

要查找数组中元素的位置，请使用 indexOf() 方法。此方法返回要查找的元素第一次出现的索引，如果未找到该元素，则返回 -1。

下面说明了 indexOf() 方法的语法。

Array.indexOf(searchElement, fromIndex)

如上所示， indexOf() 方法接受两个命名参数。

• searchElement 参数是您要在数组中查找的元素。

• fromIndex 是函数开始搜索的数组索引。

fromIndex 参数可以是正整数或负整数。如果 fromIndex 参数为负，则 indexOf() 方法开始搜索数组的长度加上 fromIndex。

如果省略 fromIndex 参数，indexOf() 方法将从字符串的开头开始搜索。

请注意，在将 searchElement 与数组中的元素进行比较时，indexOf() 方法使用类似于三重等号运算符 (===) 的严格相等比较算法。

JavaScript 数组 indexOf() 方法示例

假设您有一个scores数组，由六个数字组成，如下所示：

var scores = [10, 20, 30, 10, 40, 20];

以下示例使用 indexOf() 方法来查找scores数组中的元素：

console.log(scores.indexOf(10)); // 0console.log(scores.indexOf(30)); // 2console.log(scores.indexOf(50)); // -1console.log(scores.indexOf(20)); // 1

以下示例使用 fromIndex() 和负值：

console.log(scores.indexOf(20,-1)); // 5 (fromIndex = 6+ (-1) = 5)console.log(scores.indexOf(20,-5)); // 1 (fromIndex = 6+ (-5) = 1)

假设您有以下对象数组，其中每个对象都有两个属性：name和age。

var guests = [    {name: 'John Doe', age: 30},    {name: 'Lily Bush', age: 20},    {name: 'William Gate', age: 25}];

即使guests数组的第一个元素和 searchElement 在 name 和 age 属性中具有相同的值，以下语句也返回 -1。这是因为它们是两个不同的对象。

console.log(guests.indexOf({    name: 'John Doe',    age: 30})); // -1

有时，您想查找数组中某个元素所有出现的索引。以下 find() 函数使用 indexOf() 方法来执行此操作。

function find(needle, haystack) {    var results = [];    var idx = haystack.indexOf(needle);    while (idx != -1) {        results.push(idx);        idx = haystack.indexOf(needle, idx + 1);    }    return results;}

以下示例使用上面的 find() 函数返回scores数组中数字 10 的位置数组。

console.log(find(10,scores)); // [0, 3]

JavaScript 数组 lastIndexOf() 方法

Array 类型有另一个称为 lastIndexOf() 的方法，它提供与 indexOf() 方法类似的功能。

下面说明了 lastIndexOf() 方法的语法：

Array.lastIndexOf(searchElement[, fromIndex = Array.length - 1])

该lastIndexOf()方法返回searchElement数组中最后一次出现的索引。-1如果找不到元素，则返回。

与indexOf()方法不同，该lastIndexOf()方法向后搜索元素，从fromIndex.

以下语句返回scores数组中数字 10 和 20 的最后一个索引。

lastIndexOf() 方法返回数组中最后一次出现 searchElement 的索引。如果找不到该元素，则返回 -1。

与 indexOf() 方法不同，lastIndexOf() 方法从 fromIndex 开始向后搜索元素。

以下语句返回scores数组中数字 10 和 20 的最后一个索引。

console.log(scores.lastIndexOf(10));// 3console.log(scores.lastIndexOf(20));// 5

由于数字 50 不在scores数组中，因此以下语句返回 -1。

console.log(scores.lastIndexOf(50));// -1

总结

在今天的本教程中，我们一起学习了如何使用 JavaScript 数组 indexOf() 和 lastIndexOf() 方法来定位数组中的元素。