如何在JavaScript中將字串轉換為字元陣列?


本教程將教你如何在JavaScript中將字串轉換為字元陣列。字串是字元序列。為了解決我們的問題,我們只需要將每個字元分割開來。

在JavaScript中,有多種方法可以從字串建立字元陣列,一些內建方法可以解決我們的問題。在本教程的最後,我們還將學習透過彈出單個字元並將其推入陣列來手動將字串轉換為陣列的方法。

本教程將介紹五種不同的將字串轉換為陣列的方法。所有方法都將逐一解釋,如下所示。

  • 使用`split()`方法

  • 使用`Array.from()`方法

  • 使用`Object.assign()`方法

  • 使用擴充套件運算子

  • 建立自定義函式

使用`split()`方法

正如我們在引言中討論的那樣,字串是字元序列,我們只需要**分割**每個字元。**split()**方法是JavaScript中內建的方法,它可以做到這一點。我們將傳遞空字串作為分隔符,以便它可以將字串分割成字元並 *返回字元陣列*。

語法

下面給出JavaScript中`split()`方法的語法。

let string = "tutorialsPoint";
let charArray = string.split(delimiter)

引數

  • **分隔符** - 它是分隔符。在本例中,我們將使用空字串來分隔每個字元。

示例

<html>
<head>
   <title> Example - Converting string to character array </title>
</head>
<body>
   <h2> Converting string to character array. </h2>
   <p> Using the string.split('') method to convert to the character array:</p>
   <div id="charArray"> </div>
   <script type="text/javascript">
      let charArray = document.getElementById("charArray");
      let string = "tutorialsPoint";
      let arrayOfChar = string.split(''); // passing empty string as a delimeter.
      charArray.innerHTML = '[ ' + arrayOfChar + ' ]';
   </script>
</body>
</html>

在上面的輸出中,使用者可以看到字串“tutorialsPoint”已轉換為字元陣列。

使用`Array.from()`方法

`Array.from()`是JavaScript內建的庫方法。字串是可迭代物件,`Array.from()`將可迭代物件作為引數,並返回其值的陣列。可以說,`Array.from()`方法用於從我們作為引數傳遞的任何例項建立陣列。

語法

下面給出使用`Array.from()`方法的語法。

let str = "Example string";
let array = Array.from( str );

引數

  • **str** - 它可以是任何 *可迭代物件*。字串也是可迭代的,因此這裡我們將字串作為引數傳遞,該方法將返回字元陣列。

示例

<html>
<body>
   <h2> Converting string to character array </h2>
   <h4> Using the Array.from() method to convert to the character array:</h4>
   <div id="charArray"> </div>
   <script type="text/javascript">
      let array = document.getElementById("charArray");
      let str = " Example string ";
      let arrayOfChar = Array.from(str);
      array.innerHTML = '[ ' + arrayOfChar + ' ]';
   </script>
</body>
</html>

使用`Object.assign()`方法

將字串轉換為字元陣列的第三種方法是使用**Object.assign()**方法。它將內容從源物件複製到目標物件。這裡,我們將字串作為源物件,並將空陣列用作目標物件。

語法

使用者可以按照以下語法使用`Object.assign()`方法將字串的所有字元複製到空陣列中。

Let string = "Example";
Let array = Object.assign([ ], string );

示例

<html>
<body>
   <h2> Converting string to character array </h2>
   <h4> Using the Object.assing() method to convert to the character array:</h4>
   <div id="outputArray"> </div>
   <script type="text/javascript">
      let outputArray = document.getElementById("outputArray");
      let string = "Converting to the charater array. ";
      let array = Object.assign([], string);
      outputArray.innerHTML = '[ ' + array + ' ]';
   </script>
</body>
</html>

使用擴充套件運算子

在JavaScript中,擴充套件運算子是一個有趣的功能。擴充套件運算子的語法只是**三個點(...)**。它允許使用者將整個可迭代物件或陣列克隆到另一個數組中。我們將建立一個空陣列,並使用擴充套件運算子將字串的所有字元包裝到空陣列中。

語法

let string = "This is a string.";
let array = [...string]; // using spread operator

示例

<!DOCTYPE html>
<html>
<body>
   <h2> Converting string to character array. </h2>
   <h4> Using the spread operator to convert to the character array: </h4>
   <div id="charArray"> </div>
   <script>
      let array = document.getElementById("charArray");
      let InitialString = "This is a string.";
      let charArray = [...InitialString];
      array.innerHTML = '[ ' + charArray + ' ]';
   </script>
</body>
</html>

建立自定義函式

在此方法中,我們將建立一個空陣列。我們將使用for迴圈遍歷字串,並將字串的每個字元推入陣列。這樣,我們將從字串生成新的字元陣列。

語法

請按照以下語法實現自定義函式。

let array = [ ];
for ( let i=0; I < string.length; i++ ) {
   array.push ( string[i] );
}

示例

<!DOCTYPE html>
<html>
<body>
   <h2> Converting string to character array. </h2>
   <p> Using the for loop push the character one by one to char array: </p>
   <div id="outputArray"></div>
   <script>
      let outputArray = document.getElementById("outputArray");
      let string = "It's a string. ";
      let resultArray = []; // empty array

      // push the one by one character from the string to array using for loop.
      for (let i = 0; i < string.length; i++) {
         resultArray.push(string[i]);
      }
      outputArray.innerHTML = '[ ' + resultArray + ' ]';
   </script>
</body>
</html>

結論

我們學習了五種將字串轉換為字元陣列的方法。使用`split()`方法的第一種方法是最流行的。在最後一種方法中,我們透過使用for迴圈和空陣列實現了我們的目標,這是最慢的方法。

更新於:2022年7月25日

6K+ 次瀏覽

啟動你的職業生涯

透過完成課程獲得認證

開始學習
廣告
© . All rights reserved.