JavaScript 字串方法
基本字串方法
JavaScript 字串是原始型別且不可變的:所有字串方法都會生成一個新字串,而不會改變原始字串。
JavaScript 字串長度
length 屬性返回字串的長度
提取字串字元
有 4 種方法可以提取字串字元
at(position)方法charAt(position)方法charCodeAt(position)方法- 使用屬性訪問 [],就像在陣列中一樣
JavaScript String charAt()
charAt() 方法在字串中返回指定索引(位置)處的字元
JavaScript String charCodeAt()
charCodeAt() 方法在字串中返回指定索引處的字元程式碼
該方法返回一個 UTF-16 碼(0 到 65535 之間的整數)。
JavaScript String at() 方法
ES2022 引入了字串方法 at()
示例
獲取名字的第三個字母
const name = "W3Schools";
let letter = name.at(2);
自己動手試一試 »
獲取名字的第三個字母
const name = "W3Schools";
let letter = name[2];
自己動手試一試 »
at() 方法在字串中返回指定索引(位置)處的字元。
at() 方法自 2022 年 3 月起在所有現代瀏覽器中受支援
注意
at() 方法是 JavaScript 的新增功能。
它允許使用負索引,而 charAt() 不允許。
myString.at(-2) 而不是 charAt(myString.length-2)。瀏覽器支援
at() 是 ES2022 功能。
JavaScript 2022 (ES2022) 自 2023 年 3 月起在所有現代瀏覽器中均受支援
| Chrome 94 | Edge 94 | Firefox 93 | Safari 16.4 | Opera 79 |
| 2021 年 9 月 | 2021 年 9 月 | 2021 年 10 月 | 2023 年 3 月 | 2021 年 10 月 |
屬性訪問 [ ]
注意
屬性訪問可能有點**不可預測:**
- 它使字串看起來像陣列(但它們不是)
- 如果未找到字元,[ ] 返回 undefined,而 charAt() 返回一個空字串。
- 它是隻讀的。str[0] = "A" 不會報錯(但無效!)
提取字串部分
有 3 種方法可以提取字串的一部分
slice(start, end)substring(start, end)substr(start, length)
JavaScript String slice()
slice() 提取字串的一部分,並以新字串形式返回提取的部分。
該方法接受 2 個引數:起始位置和結束位置(不包含結束位置)。
注意
JavaScript 從零開始計算位置。
第一個位置是 0。
第二個位置是 1。
示例
如果省略第二個引數,該方法將提取字串的其餘部分
let text = "Apple, Banana, Kiwi";
let part = text.slice(7);
自己動手試一試 »
如果引數為負數,則位置從字串末尾開始計算
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12);
自己動手試一試 »
此示例從位置 -12 到位置 -6 提取字串的一部分
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12, -6);
自己動手試一試 »
JavaScript String substring()
substring() 類似於 slice()。
區別在於 substring() 將小於 0 的起始值和結束值視為 0。
如果省略第二個引數,substring() 將提取字串的其餘部分。
JavaScript String substr()
substr() 類似於 slice()。
區別在於第二個引數指定了提取部分的長度。
如果省略第二個引數,substr() 將提取字串的其餘部分。
如果第一個引數為負數,則位置從字串末尾開始計數。
轉換為大寫和小寫
使用 toUpperCase() 將字串轉換為大寫
使用 toLowerCase() 將字串轉換為小寫
JavaScript String toUpperCase()
JavaScript String toLowerCase()
示例
let text1 = "Hello World!"; // 字串
let text2 = text1.toLowerCase(); // text2 是 text1 轉換為小寫的結果
自己動手試一試 »
JavaScript String concat()
concat() 連線兩個或多個字串
concat() 方法可以代替加號運算子使用。這兩行效果相同
示例
text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!");
注意
所有字串方法都返回一個新字串。它們不會修改原始字串。
形式上講
字串是不可變的:字串不能被更改,只能被替換。
JavaScript String trim()
trim() 方法刪除字串兩端的空白字元
JavaScript 字串 trimStart() 方法
ECMAScript 2019 將字串方法 trimStart() 新增到了 JavaScript 中。
trimStart() 方法的工作方式類似於 trim(),但只刪除字串開頭的空格。
JavaScript String trimStart() 自 2020 年 1 月起在所有現代瀏覽器中均受支援
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript 字串 trimEnd() 方法
ECMAScript 2019 將字串方法 trimEnd() 新增到了 JavaScript 中。
trimEnd() 方法類似於 trim(),但僅移除字串末尾的空格。
JavaScript String trimEnd() 自 2020 年 1 月起在所有現代瀏覽器中均受支援
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript 字串填充
ECMAScript 2017 向 JavaScript 添加了兩個新的字串方法:padStart() 和 padEnd(),用於支援在字串的開頭和結尾進行填充。
JavaScript String padStart()
padStart() 方法從開頭填充字串。
它用另一個字串(多次)填充一個字串,直到達到指定的長度。
示例
用 "0" 填充字串,直到長度達到 4
let text = "5";
let padded = text.padStart(4,"0");
自己動手試一試 »
用 "x" 填充字串,直到長度達到 4
let text = "5";
let padded = text.padStart(4,"x");
自己動手試一試 »
注意
padStart() 方法是一個字串方法。
要填充數字,請先將其轉換為字串。
請參見下面的示例。
瀏覽器支援
padStart() 是 ECMAScript 2017 功能。
自 2017 年 9 月起,所有現代瀏覽器都支援 ES2017
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| 2017 年 4 月 | 2017 年 4 月 | 2017 年 3 月 | 2017 年 9 月 | 2017 年 5 月 |
Internet Explorer 不支援 padStart()。
JavaScript String padEnd()
padEnd() 方法從末尾填充字串。
它用另一個字串(多次)填充一個字串,直到達到指定的長度。
示例
let text = "5";
let padded = text.padEnd(4,"0");
自己動手試一試 »
let text = "5";
let padded = text.padEnd(4,"x");
自己動手試一試 »
注意
padEnd() 方法是一個字串方法。
要填充數字,請先將其轉換為字串。
請參見下面的示例。
瀏覽器支援
padEnd() 是 ECMAScript 2017 功能。
自 2017 年 9 月起,所有現代瀏覽器都支援 ES2017
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| 2017 年 4 月 | 2017 年 4 月 | 2017 年 3 月 | 2017 年 9 月 | 2017 年 5 月 |
Internet Explorer 不支援 padEnd()。
JavaScript String repeat()
repeat() 方法返回一個包含指定次數字符串副本的字串。
repeat() 方法返回一個新字串。
repeat() 方法不更改原始字串。
示例
建立文字副本
let text = "Hello world!";
let result = text.repeat(2);
自己動手試一試 »
let text = "Hello world!";
let result = text.repeat(4);
自己動手試一試 »
語法
string.repeat(count)
引數
| 引數 | 描述 |
| count | 必需。 想要的副本數量。 |
返回值
| 型別 | 描述 |
| 字串 | 包含副本的新字串。 |
瀏覽器支援
repeat() 是 ES6 功能(JavaScript 2015)。
自 2017 年 6 月起,所有現代瀏覽器都完全支援 ES6
| Chrome 51 | Edge 15 | Firefox 54 | Safari 10 | Opera 38 |
| 2016 年 5 月 | 2017 年 4 月 | 2017 年 6 月 | 2016 年 9 月 | 2016 年 6 月 |
Internet Explorer 不支援 repeat()。
替換字串內容
replace() 方法在字串中將指定值替換為另一個值
示例
let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");
自己動手試一試 »
注意
replace() 方法不會更改呼叫它的字串。
replace() 方法返回一個新字串。
replace() 方法僅替換**第一個**匹配項
如果要替換所有匹配項,請使用帶有 /g 標誌的正則表示式。請參閱下面的示例。
預設情況下,replace() 方法僅替換**第一個**匹配項
示例
let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");
預設情況下,replace() 方法區分大小寫。書寫 MICROSOFT(大寫)將不起作用
示例
let text = "Please visit Microsoft!";
let newText = text.replace("MICROSOFT", "W3Schools");
要實現不區分大小寫替換,請使用帶有 /i 標誌(不區分大小寫)的**正則表示式**
示例
let text = "Please visit Microsoft!";
let newText = text.replace(/MICROSOFT/i, "W3Schools");
注意
正則表示式寫時無需引號。
要替換所有匹配項,請使用帶有 /g 標誌(全域性匹配)的**正則表示式**
示例
let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace(/Microsoft/g, "W3Schools");
注意
您將在 JavaScript 正則表示式章節中學到更多關於正則表示式的知識。
JavaScript String ReplaceAll()
在 2021 年,JavaScript 引入了字串方法 replaceAll()
replaceAll() 方法允許您指定一個正則表示式而不是要替換的字串。
如果引數是正則表示式,則必須設定全域性標誌 (g),否則會丟擲 TypeError。
將字串轉換為陣列
如果您想將字串作為陣列處理,可以將其轉換為陣列。
JavaScript String split()
可以使用 split() 方法將字串轉換為陣列
如果省略分隔符,返回的陣列將在索引 [0] 中包含整個字串。
如果分隔符是 "",返回的陣列將是單個字元的陣列