JavaScript 字符串 indexOf() 方法

JavaScript indexOf() 语法

indexOf() 是 JavaScript 字符串的一个方法，它用于返回指定子串在字符串中 “第一次” 出现的索引。如果指定子串不存在，则返回 -1。

换个角度来看，我们只需要判断 indexOf() 方法返回值是否不等于 -1，就可以判断字符串中是否包含指定子串了。

语法：

str.indexOf(subStr, start)

说明：

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

• subStr（可选）：表示想要查找的子串。
• start（可选）：表示查找的开始下标，默认值为 0。如果 start 省略，则表示搜索整个字符串。如果 start 小于 0，则将从索引 0 开始（也相当于搜索整个字符串）。

JavaScript indexOf() 摘要

JavaScript indexOf() 示例

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

示例 1：indexOf() 基本用法

const str = "红绿蓝红";

console.log(str.indexOf("红"));
console.log(str.indexOf("黄"));

运行结果如下。

0
-1

分析：

由于 str 包含了两个 "红"，但 str.indexOf("红") 只会返回第一个 "红" 的下标，也就是 0。

示例 2：indexOf() 更多使用

const str = "Hello Lvye";

console.log(str.indexOf("lvye"));
console.log(str.indexOf("Lvye"));
console.log(str.indexOf("Lvyer"));

运行结果如下。

-1
6
-1

分析：

对于 str.indexOf("lvye")，由于 str 不包含 “lvye”，所以返回 -1；

对于 str.indexOf("Lvye")，由于 str 包含 “Lvye”，所以返回 “Lvye” 首次出现的下标位置。字符串的位置是从 0 开始的。

对于 str.indexOf("Lvyer")，由于 str 不包含 “Lvyer”，所以返回 -1。特别注意一下，str 包含 “Lvye”，但不包含 “Lvyer”。

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

const str = "绿叶红叶黄叶绿叶";

console.log(str.indexOf("绿叶", 0));
console.log(str.indexOf("绿叶", 2));

运行结果如下。

0
6

分析：

str.indexOf("绿叶", 0) 表示从索引 0 开始搜索 "绿叶"，返回第一个 "绿叶" 的索引 0。

str.indexOf("绿叶", 2) 表示从索引 2 开始搜索 "绿叶"。第一个 "绿叶" 在索引 0，第二个 "绿叶" 在索引 6，因此返回 6。

indexOf() 与 lastIndexOf() 的区别

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

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

示例 4：indexOf() vs lastIndexOf()

const str = "绿叶红叶黄叶绿叶";

console.log(str.indexOf("绿叶"));
console.log(str.lastIndexOf("绿叶"));

运行结果如下。

0
6

indexOf()、includes()、search() 的区别

indexOf()、includes()、search() 这 3 个方法都可以用于判断字符串是否包含指定子串，它们之间的区别如下：

• indexOf()：会返回指定子串在字符串中第一次出现的索引。如果未找到，则返回 -1。indexOf() 只支持字符串作为参数（不接受正则表达式）。我们可以通过判断返回值是否为 -1 来判断是否包含子串。
• includes()：会返回一个布尔值 (true 或 false)，表示字符串是否包含指定子串。但 includes() 无法获取子串的索引位置。
• search()：会返回第一个匹配正则表达式的子串的开始下标。如果未找到，则返回 -1。只支持正则表达式作为参数。如果传入字符串，它会先将其转换为正则表达式。此外，search() 无法获取所有匹配项的索引，也无法获取匹配到的实际子串信息（除了索引）。

在实际开发中，至于选择哪个方法，取决于我们的具体需求：

• 如果需要知道子串第一次出现的位置，应该考虑使用 indexOf()。
• 如果只需要判断字符串是否包含某个子串，includes() 是最简洁明了的选择。
• 如果需要使用正则表达式进行模式匹配并获取第一个匹配位置，应该考虑使用 search()。