詳解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!"

六、總結

本文詳細介紹了JavaScript中indexOf()方法的語法和參數，以及特殊情況和實際應用場景。

在使用indexOf()時，要注意參數的類型和三種返回值：字符串位置的索引、-1和undefined的區別。

更多詳細信息，請參考MDN文檔。