JavaScript 数组 indexOf() 方法

JavaScript indexOf() 语法

indexOf() 是 JavaScript 数组的一个方法，它用于找出指定元素在数组 “第一次” 出现时的下标。如果指定元素不存在，则返回 -1。

语法：

arr.indexOf(value, start)

说明：

indexOf() 方法可以接收以下 2 个参数。

• value（必选）：表示想要查找的元素。
• start（可选）：表示查找的开始下标，默认值为 0。
  • 当 start 省略时，表示搜索整个数组。
  • 如果 start 大于或等于数组的长度，则不会在数组中搜索，而是直接返回 -1。
  • 如果 start 是负数，则表示数组末尾开始计算索引。例如，-1 表示倒数第一个元素，-2 表示倒数第二个元素，以此类推。

对于 indexOf() 方法，小伙伴们要注意以下几点。

• indexOf() 方法会严格区分大小写。
• indexOf() 方法使用 “严格相等比较（===）” 来比较 value（查找的值）和数组中的元素。这意味着它不会将 NaN 与 NaN 匹配。
• 如果数组中有多个相同的元素，则 indexOf() 只会返回第一个匹配到的元素的索引。

JavaScript indexOf() 摘要

JavaScript indexOf() 示例

接下来，我们通过几个简单的例子来讲解一下 JavaScript indexOf() 方法是如何使用的。

示例 1：indexOf() 基本用法

const arr = ["红", "绿", "蓝", "绿"];
console.log(arr.indexOf("绿"));
console.log(arr.indexOf("黄"));

运行结果如下。

1
-1

分析：

虽然 arr 中包含两个 "绿"，但 indexOf("绿") 只会返回第一个的下标（也就是 1）。

示例 2：indexOf() 区分大小写

const arr = ["Python", "C++", "Java", "Go", "Rust"];
console.log(arr.indexOf("Go"));
console.log(arr.indexOf("go"));

运行结果如下。

3
-1

示例 3：indexOf() 设置查找的开始下标

const arr = ["Python", "C++", "Java", "Go", "Rust"];
console.log(arr.indexOf("Python", 2));
console.log(arr.indexOf("Java", -4));

运行结果如下。

-1
2

分析：

arr.indexOf("Python", 2) 表示从下标 2 的位置（即第 3 个元素）开始搜索，而 arr.indexOf("Java", -4) 表示从倒数第 4 个元素（即第 2 个元素）开始搜索。

indexOf() 与 lastIndexOf() 的区别

indexOf() 和 lastIndexOf() 这两个方法非常相似，它们之间的区别如下。

• indexOf() 是 “从左到右” 进行搜索，而 lastIndexOf() 是 “从右到左” 进行搜索。
• indexOf() 返回的是指定元素 “第一次” 出现的下标，而 lastIndexOf() 返回的是指定元素 “最后一次” 出现的下标（从右边开始数是第一个）。

示例 4：indexOf() vs lastIndexOf()

const arr = ["Python", "C++", "Java", "Go", "Python", "Rust"];
console.log(arr.indexOf("Python"));
console.log(arr.lastIndexOf("Python"));

运行结果如下。

0
4

indexOf() 与 findIndex() 的区别

初学的小伙伴很容易将 indexOf() 和 findIndex() 这两个方法混淆。实际上，它们存在本质上的区别。

• indexOf()：在数组中搜索指定值。
• findIndex()：使用回调函数来测试数组是否存在满足条件的元素。