如何在 JavaScript 中的陣列值中使用換行符?
我們使用 JavaScript 的 join() 方法在陣列值中使用換行符。它允許我們使用公共分隔符將陣列的所有組成元素連線成單個字串。
JavaScript 中的 join() 方法
JavaScript 的 join() 方法接收單個分隔符字串作為輸入,並返回一個字串,其中陣列的所有元素都由指定的分隔符字串分隔。預設情況下,分隔符字串為逗號 (,)。
join 方法使用 toString() 方法將陣列的元素轉換為相應的字串。空值或未定義的值將轉換為空字串。
語法
var str = arr.join(separator)
這裡 arr 是一個數組,str 是一個字串,separator 是使用者提供的分隔符字串。注意 分隔符是可選的。如果未提供引數,則 JavaScript 將逗號運算子視為預設值。
示例 1
在這裡,我們將展示 join 方法的使用。我們將建立一個字串陣列,並將其作為函式引數傳遞以進行列印,同時還提供分隔符字串。讓我們看看相應的程式碼。
<!DOCTYPE html> <html> <head> </head> <body> <h3> The join() method in JavaScript:<br> </h3> <p> <div id="result"> </div> </p> <script> function print(arr, separator) { var text = arr.join(separator) document.getElementById("result").innerHTML = text; } var arr = ["first", "second", "third"] var separator = "<br>" print(arr, separator) </script> </body> </html>
在上面的程式碼中,每個陣列元素都由換行符分隔。注意 但是,我們使用的是 "<br>" 來新增換行符,而不是轉義序列字元 "\
”。這是因為我們使用 innerHTML 顯示輸出,而不是傳統的字串。
帶有換行符哨兵字元或字串的字串可以拆分成相應的陣列,然後合併以建立嵌入換行符的所需字串。
讓我們來看一個例子來了解這個用例。
示例 2
我們將從提供的單個字串建立一個字串陣列,然後使用 join 方法提供所需的分隔符字串將它們合併回單個字串。
<!DOCTYPE html> <html> <head> <title> A line break in array values in JavaScript </title> </head> <body> <h3> The join() method in JavaScript:<br> </h3> <p> <div id="result"> </div> </p> <script> function print(str, separator) { var arr = str.split('#') var text = arr.join(separator) document.getElementById("result").innerHTML = text; } var str = "first#second#third" var separator = "<br>" print(str, separator) </script> </body> </html>
在這裡,我們首先使用 split() 方法進行拆分,然後使用 join() 方法將陣列連線起來,並用換行符分隔。
join 方法也可以用於非陣列物件。該方法只需要一個 length 屬性和整數可訪問索引。
但是,它的語法與傳統的 join 方法略有不同。
語法
var str = Array.prototype.join.call(arrayLikeObject, separator)
第一個引數是類似陣列的物件,第二個引數是分隔符字串。第二個引數也是可選的,逗號 (,) 為預設值。
這是一個示例:
示例 3
在這裡,我們將建立一個類似陣列的物件,它具有 length 屬性和整數索引元素。讓我們看看 join 運算子在此物件上的工作方式。
<!DOCTYPE html> <html> <head> </head> <body> <p>The join() method in JavaScript:<br> <div id="result"> </div> </p> <script> function print(obj, separator) { var text = Array.prototype.join.call(obj, separator) document.getElementById("result").innerHTML = text; } const obj = { length: 4, 0: "first", 1: "second", 2: "third", 3: "fourth", }; var separator = "<br>" print(obj, separator) </script> </body> </html>
join 方法首先讀取物件的長度。然後,它迭代這麼多元素,並使用提供的分隔符字串將它們連線起來。
注意 但是,如果提供的長度小於物件中的元素數量,則只連線這麼多元素。例如,在上面的程式碼中,如果我們將長度設定為 3,則只連線前 3 個元素。
結論
join 運算子對於將陣列或類似陣列的物件合併成單個字串非常有用。它是一個通用的方法。
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP