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] 中包含整個字串。
如果分隔符是 "",返回的陣列將是單個字元的陣列