在 JavaScript 中，字符串是不可變的，可以幫助我們存儲(chǔ)包含字符、數(shù)字和 Unicode 的文本。 此外，JavaScript 包含許多用于以各種方式創(chuàng)建和操作字符串的內(nèi)置函數(shù)。

在本文中，我將討論每個(gè)開(kāi)發(fā)人員都應(yīng)該知道的 JavaScript 字符串操作技術(shù)。

1.將字符串拆分成字符數(shù)組

作為開(kāi)發(fā)人員，我們面臨許多需要將字符串拆分為字符數(shù)組的情況。 例如，它是軟件工程師面試中被問(wèn)到最多的問(wèn)題之一。 在 JavaScript 中，有很多方法可以將字符串拆分為字符數(shù)組：

split（）

split() 方法將一個(gè)字符串分成兩個(gè)或多個(gè)子字符串的有序列表并返回它，具體取決于提供的模式、分隔符或分隔符。

let quote = 'I am Nipuni';

// Split string using the space character 

let array1 = quote.split(' '); 
console.log(array1); 
// ["I", "am", "Nipuni"] 
 
// Split string using an empty string (on each character)

let array2 = quote.split(''); 
console.log(array2); 
// ["I", " ", "a", "m", " ", "N", "i", "p", "u", "n", "i"]

from（）

Array 類(lèi)的 from() 方法是 split() 方法的主要競(jìng)爭(zhēng)對(duì)手。 它允許我們從數(shù)據(jù)源創(chuàng)建一個(gè)數(shù)組。 我們還可以使用它從可迭代的字符串中創(chuàng)建一個(gè)數(shù)組。

let name = "Nipuni Arunodi";
 
// String to array of chracters 

let nameChars = Array.from(name); 
console.log(nameChar); 
// ["N","i","p","u","n","i"," ","A","r","u","n","o","d","i"]

擴(kuò)展運(yùn)算符 (…)

擴(kuò)展運(yùn)算符是另一個(gè) JavaScript 功能，可幫助我們從字符串創(chuàng)建數(shù)組。

let name = "Nipuni Arunodi";
 
// Spread out string into an array 

let nameChar = [...name]; 
console.log(nameChar); 
// ["N","i","p","u","n","i"," ","A","r","u","n","o","d","i"]

2.檢查字符串中的特定序列

與拆分類(lèi)似，有很多方法可以檢查 JavaScript 字符串中的特定序列。 includes() 方法、indexOf() 或正則表達(dá)式可用于此類(lèi)目的。 但是，includes() 是確定字符串是否包含一個(gè)字母或一系列字母的最常用方法。 它是專(zhuān)門(mén)為此目的而創(chuàng)建的。

const text = "Hi, My name is Nipuni"

console.log(text.includes("Nipuni")); 
// true

console.log(text.includes("Arunodi")); 
// false

3.檢查字符串是否以特定序列開(kāi)頭或結(jié)尾

includes() 檢查整個(gè)字符串中的特定序列。 如果您想確定一個(gè)字符串是以特定子字符串開(kāi)頭還是結(jié)尾，有兩種專(zhuān)門(mén)的方法。

string 方法 startsWith() 確定字符串是否以特定子字符串開(kāi)頭。 如果字符串以指定的子字符串開(kāi)頭，它將返回 true。 否則，它返回 false。

const text = "Hi, My name is Nipuni"

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

endsWith() 方法允許我們確定一個(gè)字符串是否以指定的字符串結(jié)尾。

const text = "Hi, My name is Nipuni"

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

4. 在多個(gè)分隔符上拆分一個(gè)字符串

最初，我提到 split() 函數(shù)可用于將字符串拆分為數(shù)組。 同樣，您可以將正則表達(dá)式傳遞給 split() 函數(shù)以同時(shí)在多個(gè)運(yùn)算符上拆分字符串。

// Split on comma (,) and semicolon (;).

const list = "Car,Bus;Train"

const vehicles= list.split(/[,;]/);
console.log(fruits); 
// ["Car", "Bus", "Train"]

5. 反轉(zhuǎn)字符串中的字符

這是入門(mén)級(jí)開(kāi)發(fā)人員面試的另一個(gè)常規(guī)問(wèn)題。 有許多方法可以使用 JavaScript 反轉(zhuǎn)字符串。 例如，我們可以將 split() 方法與 reverse() 和 join() 方法結(jié)合起來(lái)。

使用這種方法，首先，您需要使用 split() 將字符串拆分為一個(gè)數(shù)組。 接下來(lái)，您使用 reverse() 反轉(zhuǎn)數(shù)組，然后最后使用 join() 函數(shù)再次加入它。 這是在 JavaScript 中反轉(zhuǎn)字符串的最簡(jiǎn)單方法。

const word = "Nipuni";
const reversedWord = [...word].reverse().join("");

console.log(reversedWord); // "inupiN"

6.多次復(fù)制一個(gè)字符串

repeat() 是 JavaScript 中的一個(gè)字符串方法，它允許我們重復(fù)一個(gè)字符串指定的次數(shù)。 由于 repeat() 方法是一個(gè)字符串對(duì)象方法，它必須與 String 類(lèi)的特定實(shí)例一起使用。

// Concatenate "0" 10 times.

const zeroString= "0".repeat(10);
console.log(zeroString); // "0000000000"

7. 將字符串填充到特定長(zhǎng)度

您可能希望您的字符串有時(shí)具有指定的長(zhǎng)度。 如果你的字符串太短，你會(huì)想要填補(bǔ)空白，直到它達(dá)到所需的長(zhǎng)度。 以前，人們經(jīng)常為此使用庫(kù)。 相反，您現(xiàn)在可以使用 padStart() 和 padEnd() 方法在開(kāi)頭或結(jié)尾填充字符串。

// Add 0 to the beginning until the string has a length of 10.
const string = "001".padStart(10, "0");
console.log(string); // "0000000001"

// Add * to the end until the string has a length of 10.
const string = "99".padEnd(10, "*");
console.log(string ); // "99********"

8. 計(jì)算字符串中的字符

您可以輕松地使用 string.length 方法來(lái)獲取字符串的長(zhǎng)度。 它將返回字符串中的字符數(shù)。

const word = "Nipuni";
console.log(word.length); // 6

9. 將字符串中的字母轉(zhuǎn)換為大寫(xiě)或小寫(xiě)

您可以使用 toUpperCase() 和 toLowerCase() 方法將字符串中的字符分別轉(zhuǎn)換為大寫(xiě)或小寫(xiě)。 例如，如果您需要將第一個(gè)字母大寫(xiě)，您可以使用以下方法：

// Method 1 - To Uppercase
let name = "nipuni";
name = name[0].toUpperCase() + name.substr(1);
console.log(name); // "Nipuni"

// Method 1 - To Lowercase
name = name[0].toLowerCase() + name.substr(1);
console.log(name); // "nipuni"

// Method 2 - To Uppercase
let name = "nipuni";
const characters = [...name];
characters[0] = characters[0].toUpperCase();
name = characters.join("");
console.log(name); // "Nipuni"

// Method 2 - To Lowercase
const characters = [...name];
characters[0] = characters[0].toLowerCase();
name = characters.join("");
console.log(name); // "Nipuni"

10.替換所有出現(xiàn)的字符串

有幾種方法可以替換所有出現(xiàn)的字符串。 replace() 方法或帶有全局標(biāo)志的正則表達(dá)式是開(kāi)發(fā)人員使用的一些常用方法。

但是，JavaScript 在 2021 年引入了一種名為 replaceAll() 的新方法，可以一次替換所有出現(xiàn)的內(nèi)容。 但是，目前并非所有瀏覽器或最新版本的 Node.js 都可以使用這種新方法。

const text = "I like Cars. Cars have 4 wheels"
console.log(text.replace(/Cars/g, "Vans"));
// "I like Vans. Vans have 4 wheels"

console.log(text.replaceAll("Cars", "Vans"));
// "I like Vans. Vans have 4 wheels"

結(jié)論

在幾乎每一種編程語(yǔ)言中，字符串都是最基本的數(shù)據(jù)類(lèi)型之一。 開(kāi)發(fā)人員每天都需要在他們的項(xiàng)目中處理各種字符串操作。

本文討論了每個(gè)開(kāi)發(fā)人員都應(yīng)該知道的 JavaScript 中一些最常見(jiàn)的字符串操作技術(shù)。 我希望這篇文章能幫助你提高你的知識(shí)。 感謝您的閱讀。