簡(jiǎn)介

字符串是一個(gè)包含一個(gè)或多個(gè)字符的序列，可以由字母、數(shù)字或符號(hào)組成。JavaScript 字符串中的每個(gè)字符都可以通過索引號(hào)訪問，并且所有字符串都有可用的方法和屬性。

在本教程中，我們將學(xué)習(xí)字符串原始值和String對(duì)象之間的區(qū)別，字符串的索引方式，如何訪問字符串中的字符，以及字符串常用的屬性和方法。

字符串原始值和字符串對(duì)象

首先，我們將澄清兩種字符串類型。JavaScript 區(qū)分字符串原始值（不可變數(shù)據(jù)類型）和String對(duì)象。

為了測(cè)試兩者之間的區(qū)別，我們將初始化一個(gè)字符串原始值和一個(gè)字符串對(duì)象。

// 初始化一個(gè)新的字符串原始值
const stringPrimitive = "一個(gè)新的字符串。";

// 初始化一個(gè)新的字符串對(duì)象
const stringObject = new String("一個(gè)新的字符串。");  

我們可以使用typeof運(yùn)算符來確定一個(gè)值的類型。在第一個(gè)示例中，我們只是將一個(gè)字符串賦給一個(gè)變量。

typeof stringPrimitive;

string

在第二個(gè)示例中，我們使用new String()來創(chuàng)建一個(gè)字符串對(duì)象，并將其賦給一個(gè)變量。

typeof stringObject;

object

大多數(shù)情況下，您將創(chuàng)建字符串原始值。JavaScript 能夠訪問和利用String對(duì)象包裝器的內(nèi)置屬性和方法，而無需將您創(chuàng)建的字符串原始值實(shí)際轉(zhuǎn)換為對(duì)象。

雖然這個(gè)概念一開始可能有點(diǎn)具有挑戰(zhàn)性，但您應(yīng)該意識(shí)到原始值和對(duì)象之間的區(qū)別?；旧?，所有字符串都有可用的方法和屬性，在后臺(tái)，JavaScript 將在每次調(diào)用方法或?qū)傩詴r(shí)執(zhí)行從原始值到對(duì)象的轉(zhuǎn)換和再轉(zhuǎn)換。

字符串的索引方式

字符串中的每個(gè)字符都對(duì)應(yīng)一個(gè)索引號(hào)，從0開始。

為了演示，我們將創(chuàng)建一個(gè)值為How are you?的字符串。

字符串中的第一個(gè)字符是H，對(duì)應(yīng)索引0。最后一個(gè)字符是?，對(duì)應(yīng)11?？崭褡址灿兴饕?，分別為3和7。

能夠訪問字符串中的每個(gè)字符給了我們?cè)S多處理和操作字符串的方式。

訪問字符

我們將演示如何訪問How are you?字符串中的字符和索引。

"How are you?";

使用方括號(hào)表示法，我們可以訪問字符串中的任何字符。

"How are you?"[5];

r

我們還可以使用charAt()方法，通過索引號(hào)作為參數(shù)返回字符。

"How are you?".charAt(5);

r

或者，我們可以使用indexOf()來返回第一次出現(xiàn)字符的索引號(hào)。

"How are you?".indexOf("o");

1

盡管"o"在How are you?字符串中出現(xiàn)了兩次，indexOf()將返回第一次出現(xiàn)的索引號(hào)。

lastIndexOf()用于查找最后一次出現(xiàn)的位置。

"How are you?".lastIndexOf("o");

9

對(duì)于這兩種方法，您還可以在字符串中搜索多個(gè)字符。它將返回實(shí)例中第一個(gè)字符的索引號(hào)。

"How are you?".indexOf("are");

4

另一方面，slice()方法返回兩個(gè)索引號(hào)之間的字符。第一個(gè)參數(shù)將是起始索引號(hào)，第二個(gè)參數(shù)將是應(yīng)該結(jié)束的索引號(hào)。

"How are you?".slice(8, 11);

you

請(qǐng)注意，11是?，但?不是返回輸出的一部分。slice()將返回介于兩個(gè)參數(shù)之間的內(nèi)容，但不包括最后一個(gè)參數(shù)。

如果不包括第二個(gè)參數(shù)，slice()將返回從參數(shù)到字符串末尾的所有內(nèi)容。

"How are you?".slice(8);

you?

總之，charAt()和slice()將幫助根據(jù)索引號(hào)返回字符串值，而indexOf()和lastIndexOf()將相反，根據(jù)提供的字符串字符返回索引號(hào)。

尋找字符串的長(zhǎng)度

使用 length 屬性，我們可以返回字符串中字符的數(shù)量。

"How are you?".length;

12

請(qǐng)記住，length 屬性返回的是實(shí)際字符數(shù)量，從 1 開始計(jì)數(shù)，因此結(jié)果是 12，而不是最終索引號(hào)，最終索引號(hào)從 0 開始到 11 結(jié)束。

轉(zhuǎn)換為大寫或小寫

兩個(gè)內(nèi)置方法 toUpperCase() 和 toLowerCase() 是 JavaScript 中格式化文本和進(jìn)行文本比較的有用方式。

toUpperCase() 會(huì)將所有字符轉(zhuǎn)換為大寫字符。

"How are you?".toUpperCase();

HOW ARE YOU?

toLowerCase() 會(huì)將所有字符轉(zhuǎn)換為小寫字符。

"How are you?".toLowerCase();

how are you?

這兩種格式化方法不需要額外的參數(shù)。

值得注意的是，這些方法不會(huì)改變?cè)甲址?/p>

分割字符串

JavaScript 有一個(gè)非常有用的方法，可以通過一個(gè)字符來分割字符串，并創(chuàng)建一個(gè)新的數(shù)組。我們將使用 split() 方法通過空格字符 " " 來分割數(shù)組。

const originalString = "How are you?";

// 通過空格字符分割字符串
const splitString = originalString.split(" ");

console.log(splitString);

[ 'How', 'are', 'you?' ]

現(xiàn)在我們?cè)?nbsp;splitString 變量中有了一個(gè)新的數(shù)組，我們可以通過索引號(hào)訪問每個(gè)部分。

splitString[1];

are

如果給定一個(gè)空參數(shù)，split() 將創(chuàng)建一個(gè)以逗號(hào)分隔的數(shù)組，其中包含字符串中的每個(gè)字符。

通過分割字符串，您可以確定句子中有多少個(gè)單詞，并將該方法用作確定人們的名字和姓氏的一種方式，例如。

去除空格

JavaScript 的 trim() 方法會(huì)從字符串的兩端去除空格，但不會(huì)去除中間的空格?？崭窨梢允侵票矸蚩崭瘛?/p>

const tooMuchWhitespace = "     How are you?     ";

const trimmed = tooMuchWhitespace.trim();

console.log(trimmed);

How are you?

trim() 方法是執(zhí)行去除多余空格的常見任務(wù)的簡(jiǎn)單方式。

查找和替換字符串值

我們可以使用 replace() 方法搜索字符串中的值，并用新值替換它。第一個(gè)參數(shù)將是要查找的值，第二個(gè)參數(shù)將是要替換它的值。

const originalString = "How are you?"

// 用 "Where" 替換第一個(gè)實(shí)例的 "How"
const newString = originalString.replace("How", "Where");

console.log(newString);

Where are you?

除了能夠用另一個(gè)字符串值替換值之外，我們還可以使用正則表達(dá)式使 replace() 更加強(qiáng)大。例如，replace() 只影響第一個(gè)值，但我們可以使用 g（全局）標(biāo)志來捕獲所有實(shí)例的值，以及 i（不區(qū)分大小寫）標(biāo)志來忽略大小寫。

const originalString = "Javascript is a programming language. I'm learning javascript."

// 搜索字符串中的 "javascript" 并替換為 "JavaScript"
const newString = originalString.replace(/javascript/gi, "JavaScript");

console.log(newString);

這是一個(gè)非常常見的任務(wù)，利用了正則表達(dá)式。訪問 Regexr 以練習(xí)更多正則表達(dá)式的示例。

結(jié)論

字符串是最常用的數(shù)據(jù)類型之一，我們可以做很多事情。

在本教程中，我們學(xué)習(xí)了字符串原始值和 String 對(duì)象之間的區(qū)別，字符串的索引方式，以及如何使用字符串的內(nèi)置方法和屬性來訪問字符、格式化文本以及查找和替換值。

以上就是在JavaScript中對(duì)字符串進(jìn)行索引、拆分和操作的示例代碼的詳細(xì)內(nèi)容，更多關(guān)于JavaScript字符串索引、拆分和操作的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

最新評(píng)論