详解JavaScript中indexOf的用法

一、基本概念

indexOf()是JavaScript中包含在字符串对象中的一个方法，用于查找字符串中是否包含某个子字符串，如果包含，则返回该子字符串在原字符串中第一次出现的位置索引，否则返回-1。

二、基本语法

str.indexOf(searchValue[, fromIndex])

其中，str是需要进行查找的原字符串，searchValue是需要查找的子字符串，fromIndex是搜索的起始位置，默认值为0。

三、参数解析

1、searchValue

该参数是必需的，表示需要查找的子字符串。如果是一个空串，则返回0。

如果该参数是一个RegExp对象，则会调用RegExp对象的test()方法进行查找并返回结果。如果该参数不是字符串也不是RegExp对象，则会先转换为字符串后再进行查找。

let str = "hello";
console.log(str.indexOf("ell")); // 输出 1
console.log(str.indexOf("k"));   // 输出 -1
console.log(str.indexOf(""));    // 输出 0
console.log(str.indexOf());      // 输出 -1
console.log(str.indexOf(1));     // 输出 -1

2、fromIndex

该参数是可选的，表示搜索的起始位置，默认值为0。

如果fromIndex小于0，则搜索整个字符串。

如果fromIndex大于等于字符串长度，返回-1，也就是说，没有找到子字符串。

let str = "hello";
console.log(str.indexOf("l"));     // 输出 2
console.log(str.indexOf("l", 3));  // 输出 3
console.log(str.indexOf("l", 4));  // 输出 -1
console.log(str.indexOf("o", -1)); // 输出 4

四、特殊情况

1、NaN

如果searchValue是NaN，那么结果始终是-1，因为NaN与任何值都不相等，包括NaN本身。

console.log("abc".indexOf(NaN)); // 输出 -1

2、字符串中的第i个字符

如果searchValue是一个表示字符串中第i个字符的数值时，表示查找字符串中下标为i的字符是否包含在searchValue中。

console.log("hello".indexOf(2)); // 输出 2
console.log("hello".indexOf(3)); // 输出 -1

3、undefined 和 null

对于undefined和null两个特殊的值来说，如果不显式转换成字符串，则会自动转换为"undefined"和"null"字符串进行查找。

console.log("hello".indexOf(undefined));  // 输出 -1
console.log("hello".indexOf(null));       // 输出 -1
console.log("hello".indexOf("undefined")); // 输出 -1
console.log("hello".indexOf("null"));      // 输出 -1

五、实际应用

indexOf()方法在实际开发中非常常用，常用于字符串替换，查找某个字符串是否包含指定字符等场景。

例如，下面这个例子是将字符串中的"world"替换为"JavaScript"。

let str = "hello world!";
let index = str.indexOf("world");
if (index !== -1) {
   str = str.slice(0, index) + "JavaScript" + str.slice(index + 5);
}
console.log(str); // 输出 "hello JavaScript!"