iT邦幫忙

2025 iThome 鐵人賽

DAY 29
0
Modern Web

30天絕望倒數JavaScript系列 第 29

JavaScript String Search

  • 分享至 

  • xImage
  •  

在 JavaScript 中,有多種方法可以搜尋字串中的特定文字或模式。這些方法可用來找出子字串的位置、是否存在、或使用正規表達式做更複雜的搜尋。

常見搜尋方法一覽表

方法 功能 回傳值 是否支援正規表達式
indexOf() 回傳子字串第一次出現的位置 數字(索引)
lastIndexOf() 回傳子字串最後一次出現的位置 數字(索引)
search() 搜尋字串(可用正規表達式) 數字(索引)
includes() 判斷字串是否包含指定文字 布林值(true / false)
startsWith() 判斷字串是否以指定文字開頭 布林值
endsWith() 判斷字串是否以指定文字結尾 布林值
match() 傳回符合正規表達式的結果 陣列或 null
matchAll() 傳回所有符合正規表達式的結果(迭代器) 迭代器

1. indexOf() — 找出第一次出現位置

let text = "I love JavaScript!";
let pos = text.indexOf("love");
console.log(pos); // 2

說明:

  • 若找不到則回傳 -1
  • 可指定搜尋起始位置:text.indexOf("love", 3)

2. lastIndexOf() — 找出最後一次出現位置

let text = "Hello world, hello JavaScript!";
let pos = text.lastIndexOf("hello");
console.log(pos); // 13

說明:

  • 會從右邊往左搜尋
  • 若找不到則回傳 -1

3. search() — 使用正規表達式搜尋

let text = "The rain in SPAIN stays mainly in the plain";
let pos = text.search(/ain/i);
console.log(pos); // 4

說明:

  • 可使用正規表達式(RegExp)
  • 不支援第二個「起始位置」參數

4. includes() — 判斷是否包含子字串

let text = "I love JavaScript!";
console.log(text.includes("love")); // true
console.log(text.includes("Love")); // false

說明:

  • 區分大小寫
  • 可指定起始位置:text.includes("love", 5)

5. startsWith() — 是否以指定字開頭

let text = "Hello world!";
console.log(text.startsWith("Hello")); // true
console.log(text.startsWith("world")); // false

說明:

  • 可指定起始位置:text.startsWith("world", 6)

6. endsWith() — 是否以指定字結尾

let text = "Hello world!";
console.log(text.endsWith("world!")); // true
console.log(text.endsWith("Hello"));  // false

說明:

  • 可指定比對長度:text.endsWith("Hello", 5) → true

7. match() — 回傳符合的結果(正規表達式)

let text = "The rain in SPAIN stays mainly in the plain";
let result = text.match(/ain/gi);
console.log(result); // ["ain", "AIN", "ain", "ain"]

說明:

  • 若無匹配,回傳 null
  • 加上 /g 會回傳所有結果

8. matchAll() — 回傳所有匹配(含細節)

let text = "test1 test2";
let iterator = text.matchAll(/t(e)(st(\d?))/g);

for (let match of iterator) {
  console.log(match);
}

輸出範例:

["test1", "e", "st1", "1", index: 0, input: "test1 test2", groups: undefined]
["test2", "e", "st2", "2", index: 6, input: "test1 test2", groups: undefined]

小結

任務 建議方法
找出字串出現位置 indexOf() / lastIndexOf()
是否包含子字串 includes()
是否以特定文字開頭或結尾 startsWith() / endsWith()
正規表達式搜尋 search() / match() / matchAll()

上一篇
JavaScript String Methods
下一篇
JavaScript String Reference
系列文
30天絕望倒數JavaScript30
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言