範例介紹javaScript操作字串的一些常用方法

本篇文章給大家帶來了關於的相關知識，主要介紹了javaScript操作字串的一些常用方法，文中通過範例程式碼介紹的非常詳細，具有一定的參考價值，下面一起來看一下，希望對大家有幫助。

【相關推薦：、】

1. 獲取字串長度

JavaScript中的字串有一個length屬性，該屬性可以用來獲取字串的長度

const str = 'hello';
str.length   // 輸出結果：5

2. 獲取字串指定位置的值

charAt()和charCodeAt()方法都可以通過索引來獲取指定位置的值：

charAt() 方法獲取到的是指定位置的字元；
charCodeAt()方法獲取的是指定位置字元的Unicode值。

（1）charAt()

charAt() 方法可以返回指定位置的字元。其語法如下：

string.charAt(index)

index表示字元在字串中的索引值：

const str = 'hello';
str.charAt(1)  // 輸出結果：e

字串也可以通過索引值來直接獲取對應字元，那它和charAt()有什麼區別呢

const str = 'hello';
str.charAt(1)  // 輸出結果：e 
str[1]         // 輸出結果：e 
str.charAt(5)  // 輸出結果：'' 
str[5]         // 輸出結果：undefined

可以看到，當index的取值不在str的長度範圍內時，str[index]會返回undefined，而charAt(index)會返回空字串；除此之外，str[index]不相容ie6-ie8，charAt(index)可以相容。

（2）charCodeAt()

charCodeAt()：該方法會返回指定索引位置字元的 Unicode 值，返回值是 0 - 65535 之間的整數，表示給定索引處的 UTF-16 程式碼單元，如果指定位置沒有字元，將返回 NaN：

let str = "abcdefg";
console.log(str.charCodeAt(1)); // "b" --> 98

通過這個方法，可以獲取字串中指定Unicode編碼值範圍的字元。比如，數位0～9的Unicode編碼範圍是: 48～57，可以通過這個方法來篩選字串中的數位，當然如果你更熟悉正規表示式，會更方便。

3. 檢索字串是否包含特定序列

這5個方法都可以用來檢索一個字串中是否包含特定的序列。其中前兩個方法得到的指定元素的索引值，並且只會返回第一次匹配到的值的位置。後三個方法返回的是布林值，表示是否匹配到指定的值。

注意：這5個方法都對大小寫敏感！

（1）indexOf()

indexOf()：查詢某個字元，有則返回第一次匹配到的位置，否則返回-1，其語法如下：

string.indexOf(searchvalue,fromindex)

該方法有兩個引數：

searchvalue：必需，規定需檢索的字串值；
fromindex：可選的整數引數，規定在字串中開始檢索的位置。它的合法取值是 0 到 string.length - 1。如省略該，則從字串的首字元開始檢索。

let str = "abcdefgabc";
console.log(str.indexOf("a"));   // 輸出結果：0
console.log(str.indexOf("z"));   // 輸出結果：-1
console.log(str.indexOf("c", 4)) // 輸出結果：9

（2）lastIndexOf()

lastIndexOf()：查詢某個字元，有則返回最後一次匹配到的位置，否則返回-1

let str = "abcabc";
console.log(str.lastIndexOf("a"));  // 輸出結果：3
console.log(str.lastIndexOf("z"));  // 輸出結果：-1

該方法和indexOf()類似，只是查詢的順序不一樣，indexOf()是正序查詢，lastIndexOf()是逆序查詢。

（3）includes()

includes()：該方法用於判斷字串是否包含指定的子字串。如果找到匹配的字串則返回 true，否則返回 false。該方法的語法如下：

string.includes(searchvalue, start)

該方法有兩個引數：

searchvalue：必需，要查詢的字串；
start：可選，設定從那個位置開始查詢，預設為 0。

let str = 'Hello world!';

str.includes('o')  // 輸出結果：true
str.includes('z')  // 輸出結果：false
str.includes('e', 2)  // 輸出結果：false

（4）startsWith()

startsWith()：該方法用於檢測字串是否以指定的子字串開始。如果是以指定的子字串開頭返回 true，否則 false。其語法和上面的includes()方法一樣。

let str = 'Hello world!';

str.startsWith('Hello') // 輸出結果：true
str.startsWith('Helle') // 輸出結果：false
str.startsWith('wo', 6) // 輸出結果：true

（5）endsWith()

endsWith()：該方法用來判斷當前字串是否是以指定的子字串結尾。如果傳入的子字串在搜尋字串的末尾則返回 true，否則將返回 false。其語法如下：

string.endsWith(searchvalue, length)

該方法有兩個引數：

searchvalue：必需，要搜尋的子字串；
length：設定字串的長度，預設值為原始字串長度 string.length。

let str = 'Hello world!';

str.endsWith('!')       // 輸出結果：true
str.endsWith('llo')     // 輸出結果：false
str.endsWith('llo', 5)  // 輸出結果：true

可以看到，當第二個引數設定為5時，就會從字串的前5個字元中進行檢索，所以會返回true。

4. 連線多個字串

concat() 方法用於連線兩個或多個字串。該方法不會改變原有字串，會返回連線兩個或多個字串的新字串。其語法如下：

string.concat(string1, string2, ..., stringX)

其中引數 string1, string2, ..., stringX 是必須的，他們將被連線為一個字串的一個或多個字串物件。

let str = "abc";
console.log(str.concat("efg"));          //輸出結果："abcefg"
console.log(str.concat("efg","hijk")); //輸出結果："abcefghijk"

雖然concat()方法是專門用來拼接字串的，但是在開發中使用最多的還是加操作符+，因為其更加簡單。

5. 字串分割成陣列

split() 方法用於把一個字串分割成字串陣列。該方法不會改變原始字串。其語法如下：

string.split(separator,limit)

該方法有兩個引數：

separator：必需。字串或正規表示式，從該引數指定的地方分割 string。
limit：可選。該引數可指定返回的陣列的最大長度。如果設定了該引數，返回的子串不會多於這個引數指定的陣列。如果沒有設定該引數，整個字串都會被分割，不考慮它的長度。

let str = "abcdef";
str.split("c");    // 輸出結果：["ab", "def"]
str.split("", 4)   // 輸出結果：['a', 'b', 'c', 'd']

如果把空字串用作 separator，那麼字串中的每個字元之間都會被分割。

str.split("");     // 輸出結果：["a", "b", "c", "d", "e", "f"]

其實在將字串分割成陣列時，可以同時拆分多個分割符，使用正規表示式即可實現：

const list = "apples,bananas;cherries"
const fruits = list.split(/[,;]/)
console.log(fruits);  // 輸出結果：["apples", "bananas", "cherries"]

6. 擷取字串

substr()、substring()和 slice() 方法都可以用來擷取字串。

（1） slice()

slice() 方法用於提取字串的某個部分，並以新的字串返回被提取的部分。其語法如下：

string.slice(start,end)

該方法有兩個引數：

start：必須。要擷取的片斷的起始下標，第一個字元位置為 0。如果為負數，則從尾部開始擷取。
end：可選。要擷取的片段結尾的下標。若未指定此引數，則要提取的子串包括 start 到原字串結尾的字串。如果該引數是負數，那麼它規定的是從字串的尾部開始算起的位置。

上面說了，如果start是負數，則該引數規定的是從字串的尾部開始算起的位置。也就是說，-1 指字串的最後一個字元，-2 指倒數第二個字元，以此類推：

let str = "abcdefg";
str.slice(1,6);   // 輸出結果："bcdef" 
str.slice(1);     // 輸出結果："bcdefg" 
str.slice();      // 輸出結果："abcdefg" 
str.slice(-2);    // 輸出結果："fg"
str.slice(6, 1);  // 輸出結果：""

注意，該方法返回的子串包括開始處的字元，但不包括結束處的字元。

（2） substr()

substr() 方法用於在字串中抽取從開始下標開始的指定數目的字元。其語法如下：

string.substr(start,length)

該方法有兩個引數：

start 必需。要抽取的子串的起始下標。必須是數值。如果是負數，那麼該引數宣告從字串的尾部開始算起的位置。也就是說，-1 指字串中最後一個字元，-2 指倒數第二個字元，以此類推。
length：可選。子串中的字元數。必須是數值。如果省略了該引數，那麼返回從 stringObject 的開始位置到結尾的字串。

let str = "abcdefg";
str.substr(1,6); // 輸出結果："bcdefg" 
str.substr(1);   // 輸出結果："bcdefg" 相當於擷取[1,str.length-1]
str.substr();    // 輸出結果："abcdefg" 相當於擷取[0,str.length-1]
str.substr(-1);  // 輸出結果："g"

（3） substring()

substring() 方法用於提取字串中介於兩個指定下標之間的字元。其語法如下：

string.substring(from, to)

該方法有兩個引數：

from：必需。一個非負的整數，規定要提取的子串的第一個字元在 string 中的位置。
to：可選。一個非負的整數，比要提取的子串的最後一個字元在 string 中的位置多 1。如果省略該引數，那麼返回的子串會一直到字串的結尾。

注意： 如果引數 from 和 to 相等，那麼該方法返回的就是一個空串（即長度為 0 的字串）。如果 from 比 to 大，那麼該方法在提取子串之前會先交換這兩個引數。並且該方法不接受負的引數，如果引數是個負數，就會返回這個字串。

let str = "abcdefg";
str.substring(1,6); // 輸出結果："bcdef" [1,6)
str.substring(1);   // 輸出結果："bcdefg" [1,str.length-1]
str.substring();    // 輸出結果："abcdefg" [0,str.length-1]
str.substring(6,1); // 輸出結果 "bcdef" [1,6)
str.substring(-1);  // 輸出結果："abcdefg"

注意，該方法返回的子串包括開始處的字元，但不包括結束處的字元。

7. 字串大小寫轉換

toLowerCase() 和 toUpperCase()方法可以用於字串的大小寫轉換。

（1）toLowerCase()

toLowerCase()：該方法用於把字串轉換為小寫。

let str = "adABDndj";
str.toLowerCase(); // 輸出結果："adabdndj"

（2）toUpperCase()

toUpperCase()：該方法用於把字串轉換為大寫。

let str = "adABDndj";
str.toUpperCase(); // 輸出結果："ADABDNDJ"

我們可以用這個方法來將字串中第一個字母變成大寫：

let word = 'apple'
word = word[0].toUpperCase() + word.substr(1)
console.log(word) // 輸出結果："Apple"

8. 字串模式匹配

replace()、match()和search()方法可以用來匹配或者替換字元。

（1）replace()

replace()：該方法用於在字串中用一些字元替換另一些字元，或替換一個與正規表示式匹配的子串。其語法如下：

string.replace(searchvalue, newvalue)

該方法有兩個引數：

searchvalue：必需。規定子字串或要替換的模式的 RegExp 物件。如果該值是一個字串，則將它作為要檢索的直接量文字模式，而不是首先被轉換為 RegExp 物件。
newvalue：必需。一個字串值。規定了替換文字或生成替換文字的函數。

let str = "abcdef";
str.replace("c", "z") // 輸出結果：abzdef

執行一個全域性替換, 忽略大小寫:

let str="Mr Blue has a blue house and a blue car";
str.replace(/blue/gi, "red");    // 輸出結果：'Mr red has a red house and a red car'

注意： 如果 regexp 具有全域性標誌 g，那麼 replace() 方法將替換所有匹配的子串。否則，它只替換第一個匹配子串。

（2）match()

match()：該方法用於在字串內檢索指定的值，或找到一個或多個正規表示式的匹配。該方法類似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字串的位置。其語法如下：

string.match(regexp)

該方法的引數 regexp 是必需的，規定要匹配的模式的 RegExp 物件。如果該引數不是 RegExp 物件，則需要首先把它傳遞給 RegExp 建構函式，將其轉換為 RegExp 物件。

注意： 該方法返回存放匹配結果的陣列。該陣列的內容依賴於 regexp 是否具有全域性標誌 g。

let str = "abcdef";
console.log(str.match("c")) // ["c", index: 2, input: "abcdef", groups: undefined]

（3）search()

search()方法用於檢索字串中指定的子字串，或檢索與正規表示式相匹配的子字串。其語法如下：

string.search(searchvalue)

該方法的引數 regex 可以是需要在 string 中檢索的子串，也可以是需要檢索的 RegExp 物件。

注意： 要執行忽略大小寫的檢索，請追加標誌 i。該方法不執行全域性匹配，它將忽略標誌 g，也就是隻會返回第一次匹配成功的結果。如果沒有找到任何匹配的子串，則返回 -1。

返回值： 返回 str 中第一個與 regexp 相匹配的子串的起始位置。

let str = "abcdef";
str.search(/bcd/)   // 輸出結果：1

9. 移除字串收尾空白符

trim()、trimStart()和trimEnd()這三個方法可以用於移除字串首尾的頭尾空白符，空白符包括：空格、製表符 tab、換行符等其他空白符等。

（1）trim()

trim() 方法用於移除字串首尾空白符，該方法不會改變原始字串：

let str = "  abcdef  "
str.trim()    // 輸出結果："abcdef"

注意，該方法不適用於null、undefined、Number型別。

（2）trimStart()

trimStart() 方法的的行為與trim()一致，不過會返回一個從原始字串的開頭刪除了空白的新字串，不會修改原始字串：

const s = '  abc  ';

s.trimStart()   // "abc  "

（3）trimEnd()

trimEnd() 方法的的行為與trim()一致，不過會返回一個從原始字串的結尾刪除了空白的新字串，不會修改原始字串：

const s = '  abc  ';

s.trimEnd()   // "  abc"

10. 獲取字串本身

valueOf()和toString()方法都會返回字串本身的值，感覺用處不大。

（1）valueOf()

valueOf()：返回某個字串物件的原始值，該方法通常由 JavaScript 自動進行呼叫，而不是顯式地處於程式碼中。

let str = "abcdef"
console.log(str.valueOf()) // "abcdef"

（2）toString()

toString()：返回字串物件本身

let str = "abcdef"
console.log(str.toString()) // "abcdef"

11. 重複一個字串

repeat() 方法返回一個新字串，表示將原字串重複n次：

'x'.repeat(3)     // 輸出結果："xxx"
'hello'.repeat(2) // 輸出結果："hellohello"
'na'.repeat(0)    // 輸出結果：""

如果引數是小數，會向下取整：

'na'.repeat(2.9) // 輸出結果："nana"

如果引數是負數或者Infinity，會報錯：

'na'.repeat(Infinity)   // RangeError
'na'.repeat(-1)         // RangeError

如果引數是 0 到-1 之間的小數，則等同於 0，這是因為會先進行取整運算。0 到-1 之間的小數，取整以後等於-0，repeat視同為 0。

'na'.repeat(-0.9)   // 輸出結果：""

如果引數是NaN，就等同於 0：

'na'.repeat(NaN)    // 輸出結果：""

如果repeat的引數是字串，則會先轉換成數位。

'na'.repeat('na')   // 輸出結果：""
'na'.repeat('3')    // 輸出結果："nanana"

12. 補齊字串長度

padStart()和padEnd()方法用於補齊字串的長度。如果某個字串不夠指定長度，會在頭部或尾部補全。

（1）padStart()

padStart()用於頭部補全。該方法有兩個引數，其中第一個引數是一個數位，表示字串補齊之後的長度；第二個引數是用來補全的字串。

如果原字串的長度，等於或大於指定的最小長度，則返回原字串：

'x'.padStart(1, 'ab') // 'x'

如果用來補全的字串與原字串，兩者的長度之和超過了指定的最小長度，則會截去超出位數的補全字串：

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

如果省略第二個引數，預設使用空格補全長度：

'x'.padStart(4) // '   x'

padStart()的常見用途是為數值補全指定位數，筆者最近做的一個需求就是將返回的頁數補齊為三位，比如第1頁就顯示為001，就可以使用該方法來操作：

"1".padStart(3, '0')   // 輸出結果： '001'
"15".padStart(3, '0')  // 輸出結果： '015'

（2）padEnd()

padEnd()用於尾部補全。該方法也是接收兩個引數，第一個引數是字串補全生效的最大長度，第二個引數是用來補全的字串：

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

13. 字串轉為數位

parseInt()和parseFloat()方法都用於將字串轉為數位。

（1）parseInt()

parseInt() 方法用於可解析一個字串，並返回一個整數。其語法如下：

parseInt(string, radix)

該方法有兩個引數：

string：必需。要被解析的字串。
radix：可選。表示要解析的數位的基數。該值介於 2 ~ 36 之間。

當引數 radix 的值為 0，或沒有設定該引數時，parseInt() 會根據 string 來判斷數位的基數。

parseInt("10");			  // 輸出結果：10
parseInt("17",8);		  // 輸出結果：15 (8+7)
parseInt("010");		  // 輸出結果：10 或 8

當引數 radix 的值以「0x」或「0X」開頭，將以 16 為基數：

parseInt("0x10")      // 輸出結果：16

如果該引數小於 2 或者大於 36，則 parseInt() 將返回 NaN：

parseInt("50", 1)      // 輸出結果：NaN
parseInt("50", 40)     // 輸出結果：NaN

只有字串中的第一個數位會被返回，當遇到第一個不是數位的字元為止:

parseInt("40 4years")   // 輸出結果：40

如果字串的第一個字元不能被轉換為數位，就會返回 NaN：

parseInt("new100")     // 輸出結果：NaN

字串開頭和結尾的空格是允許的：

parseInt("  60  ")    // 輸出結果： 60

（2）parseFloat()

parseFloat() 方法可解析一個字串，並返回一個浮點數。該方法指定字串中的首個字元是否是數位。如果是，則對字串進行解析，直到到達數位的末端為止，然後以數位返回該數位，而不是作為字串。其語法如下：

parseFloat(string)

parseFloat 將它的字串引數解析成為浮點數並返回。如果在解析過程中遇到了正負號（+ 或 -）、數位 (0-9)、小數點，或者科學記數法中的指數（e 或 E）以外的字元，則它會忽略該字元以及之後的所有字元，返回當前已經解析到的浮點數。同時引數字串首位的空白符會被忽略。

parseFloat("10.00")      // 輸出結果：10.00
parseFloat("10.01")      // 輸出結果：10.01
parseFloat("-10.01")     // 輸出結果：-10.01
parseFloat("40.5 years") // 輸出結果：40.5

如果引數字串的第一個字元不能被解析成為數位，則 parseFloat 返回 NaN。

parseFloat("new40.5")    // 輸出結果：NaN

14.如何多次複製一個字串

JS 字串允許簡單的重複，與純手工複製字串不同，我們可以使用字串的repeat方法。

const laughing = '小智'.repeat(3)
consol.log(laughing) // "小智小智小智"

const eightBits = '1'.repeat(8)
console.log(eightBits) // "11111111"

15. 如何填充一個字串到指定的長度

有時，我們希望字串具有特定長度。如果字串太短，則需要填充剩餘空間，直到達到指定的長度為止。

過去，主要還是使用庫 left-pad。但是，今天我們可以使用padStart和SpadEnd方法，選擇哪種方法取決於是在字串的開頭還是結尾填充字串。

// 在開頭新增 "0"，直到字串的長度為 8。
const eightBits = '001'.padStart(8, '0')
console.log(eightBits) // "00000001"

//在末尾新增「 *」，直到字串的長度為5。
const anonymizedCode = "34".padEnd(5, "*")
console.log(anonymizedCode) // "34***"

16.如何將字串拆分為字元陣列

有多種方法可以將字串分割成字元陣列，我更喜歡使用擴充套件操作符(...):

const word = 'apple'
const characters = [...word]
console.log(characters) // ["a", "p", "p", "l", "e"]

注意，這並不總是像預期的那樣工作。有關更多資訊，請參見下一個技巧。

17.如何計算字串中的字元

可以使用length屬性。

const word = "apple";
console.log(word.length) // 5

但對於中文來說，這個方法就不太靠譜。

const word = "?"
console.log(word.length) // 2

日本漢字?返回length為2，為什麼？ JS 將大多數位符表示為16位元程式碼點。但是，某些字元表示為兩個（或更多）16 位程式碼點，稱為代理對。如果使用的是length屬性，JS 告訴你使用了多少程式碼點。因此，?（hokke）由兩個程式碼點組成，返回錯誤的值。

那怎麼去判斷呢，使用解構操作符號(...)

const word = "?"
const characters = [...word]
console.log(characters.length) // 1

這種方法在大多數情況下都有效，但是有一些極端情況。例如，如果使用表情符號，則有時此長度也是錯誤的。如果真想計算字元正確長度，則必須將單詞分解為 字素簇(Grapheme Clusters) ，這超出了本文的範圍，這裡就不在這說明。

18.如何反轉字串中的字元

反轉字串中的字元是很容易的。只需組合擴充套件操作符(...)、Array.reverse方法和Array.join方法。

const word = "apple"
const reversedWord = [...word].reverse().join("")
console.log(reversedWord) // "elppa"

和前面一樣，也有一些邊緣情況。遇到邊緣的情況就有需要首先將單詞拆分為字素簇。

19. 如何將字串中的第一個字母大寫

一個非常常見的操作是將字串的第一個字母大寫。雖然許多程式語言都有一種本地方法來實現這一點，但 JS 需要做一些工作。

let word = 'apply'

word = word[0].toUpperCase() + word.substr(1)

console.log(word) // "Apple"

另一種方法:

// This shows an alternative way
let word = "apple";

// 使用擴充套件運運算元（`...`）拆分為字元

const characters = [...word];
characters[0] = characters[0].toUpperCase();
word = characters.join("");

console.log(word); // "Apple"

20.如何在多個分隔符上分割字串

假設我們要在分隔符上分割字串，第一想到的就是使用split方法，這點，智米們肯定知道。但是，有一點大家可能不知道，就是split可以同時拆分多個分隔符, 使用正規表示式就可以實現：

// 用逗號(,)和分號(;)分開。

const list = "apples,bananas;cherries"
const fruits = list.split(/[,;]/)
console.log(fruits); // ["apples", "bananas", "cherries"]

21.如何檢查字串是否包含特定序列

字串搜尋是一項常見的任務。在 JS 中，你可以使用String.includes方法輕鬆完成此操作。不需要正規表示式。

const text = "Hello, world! My name is Kai!"
console.log(text.includes("Kai")); // true

22.如何檢查字串是否以特定序列開頭或結尾

在字串的開頭或結尾進行搜尋，可以使用String.startsWith和String.endsWith方法。

const text = "Hello, world! My name is Kai!"

console.log(text.startsWith("Hello")); // true

console.log(text.endsWith("world")); // false

23.如何替換所有出現的字串

有多種方法可以替換所有出現的字串。可以使用String.replace方法和帶有全域性標誌的正規表示式。或者，可以使用新的String.replaceAll方法。請注意，並非在所有瀏覽器和Node.js 版本中都可用此新方法。

const text = "I like apples. You like apples."

console.log(text.replace(/apples/g, "bananas"));
// "I like bananas. You like bananas."

console.log(text.replaceAll("apples", "bananas"));
// "I lik

24. JSON格式化和解析

JSON 不是僅限 JavaScript 的資料型別，並且廣泛用於前後端資料互動。JSON.stringify() 函數用於將物件轉換為 JSON 格式的字串。通常，只需將物件作為引數即可，如下所示：

const article = {
    title: "JavaScript 字串技巧",
    view: 30000,
    comments: null,
    content: undefined,
};
const strArticle = JSON.stringify(article); 

console.log(strArticle); // {"title":"JavaScript 字串技巧","view":30000,"comments":null}

從上面的程式碼可以看到，在 stringify 中會過濾掉 undefined 的值，但 null 值不會。

JSON.stringify() 可以接受兩個可選引數，第二個引數是一個替換器，可以在其中指定要列印的鍵的陣列或清除它們的函數。如下程式碼：

console.log(JSON.stringify(article, ["title", "comments"])); // {"title":"JavaScript 字串技巧","comments":null}
console.log(JSON.stringify(article, [])); // {}

對於一個巨大的 JSON，傳遞一個長陣列可能影響可讀性及效率。因此，可以設定替換函數併為要跳過的鍵返回 undefined ，如下程式碼：

const result = JSON.stringify(article, (key, value) =>
    key === "title" ? undefined : value
);
console.log(result); // {"view":30000,"comments":null}

JSON.stringify() 的第三個引數通過指定縮排（在巢狀塊中很有用）來格式化 JSON，可以傳遞一個數位來設定縮排間距，甚至可以傳遞一個字串來替換空格。如下程式碼：

console.log(JSON.stringify(article, ["title"], "\t"));

輸出的格式如下：

{
    "title": "JavaScript 字串技巧"
}

還有一個 JSON.parse() 函數，它接受一個 JSON 字串並將其轉換為一個 JavaScript 物件。它還接受一個 reviver 函數，可以在返回值之前攔截物件屬性並修改屬性值。

const reviver = (key, value) => (key === "view" ? 0 : value);

var jsonString = JSON.stringify(article);
var jsonObj = JSON.parse(jsonString, reviver);

console.log(jsonObj); // { title: 'JavaScript 字串技巧', view: 0, comments: null }

25. 多行字串和嵌入式表示式

在 JavaScript 中有三種建立字串的方式，可以使用單引號 '' 、雙引號 "" 或反引號（鍵盤的左上方， 1 的左邊按鍵）。

const countries1 = "China";
const countries2 = "China";
const countries3 = `China`;

前兩種建立方式基本相同，並且可以混合和匹配以連線或新增帶引號的字串（通過使用相反的語法風格），而反引號可以對字串進行花哨而強大的操作。

反引號也稱為模板字面量，反引號在建立多行字串和嵌入表示式時很方便。下面是如何在 JavaScript 中使用字串插值建立多行字串的程式碼：

const year = "2021";
const month = 7;
const day = 2;
const detail = `今天是${year}年${month}月${day}日，
是個不錯的日子！`;

console.log(detail);

輸出的結果也換行了，如下：

今天是2021年7月2日，
是個不錯的日子！

除了字串字面量，在 ${} 中允許任何有效的表示式，它可以是一個函數呼叫或表示式，甚至是一個巢狀模板。

標記模板是模板字面量的一種高階形式，它允許使用一個函數來解析模板字面量，其中內嵌的表示式是引數。如下程式碼：

const title = "JavaScript 字串技巧";
const view = 30000;

const detail = (text, titleExp, viewExp) => {
    const [string1, string2, string3] = [...text];
    return `${string1}${titleExp}${string2}${viewExp}${string3}`;
};

const intro = detail`本文的標題是《${title}》，當前閱讀量是： ${view}`;

console.log(intro); // 文的標題是《JavaScript 字串技巧》，當前閱讀量是：30000

26. 驗證字串陣列中是否存在子字串

查詢 JavaScript 字串中是否存在子字串時間容易的事情，在 ES6 中，只需要使用 includes 函數。

但需要驗證字串是否存於資料中，主要陣列中其中一項包含就返回 true ，如果都不包含返回 false，因此需要使用 some 函數與includes 一起使用，如下程式碼：

const arrayTitles = ["Javascript", "EScript", "Golang"];
const hasText = (array, findText) =>
    array.some((item) => item.includes(findText));

console.log(hasText(arrayTitles, "script")); // true
console.log(hasText(arrayTitles, "php")); // false

【相關推薦：、】

以上就是範例介紹javaScript操作字串的一些常用方法的詳細內容，更多請關注TW511.COM其它相關文章！