在 JavaScript 中連接字符串的 4 種方法

字符串連接是任何編程語言中的常見任務。 JavaScript 中有 4 種組合字符串的方法。

在本文中，我們將了解所有這些在 JavaScript 中執行字符串連接的方法。

concat() 方法

JavaScript String 對像有一個內置的 concat() 方法。顧名思義，此方法連接或合併兩個或多個字符串。

concat() 方法不會就地修改字符串。相反，它會創建並返回一個包含連接字符串文本的新字符串。

const name = 'Atta';
const country = '🇵🇰';

const str = 'My name is '.concat(name, ', and I\'m from ', country);

console.log(str);
// My name is Atta, and I'm from 🇵🇰

如果參數不是字符串類型，在拼接前會自動轉換為字符串值。

const str = 'The price is $'.concat(45.99);

console.log(str);
// The price is $45.99

+ 運算符

相同的+ 我們用來添加兩個數字的運算符也可以用於組合兩個字符串：

const name = 'Atta';
const country = '🇵🇰';

const str = name + ' ' + country;

console.log(str);
// Atta 🇵🇰

上述方法創建了一個全新的字符串。要改變現有字符串，您可以使用簡寫 += 運營商：

const name = 'Atta';
const country = '🇵🇰';

let str = name;
str += ' ';
str += country;

console.log(str);
// Atta 🇵🇰

賦值運算符（+ , += ) 在現代 JavaScript 引擎上執行得更快，因此無需使用 concat() 方法。

但是，如果您更喜歡可讀性而不是性能，請使用模板文字（如下所述）。

模板文字

模板文字提供了一種在 JavaScript 中處理字符串的現代方式。它們主要是帶有嵌入式表達式的字符串文字。您可以使用字符串插值、多行字符串和標記表達式。

const name = 'Atta';
const country = '🇵🇰';

const str = `My name is ${name}, and I'm from ${country}`;

console.log(str);
// My name is Atta, and I'm from 🇵🇰

我個人在 JavaScript（甚至在 Node.js）中使用模板文字來組合字符串。因為它們更具可讀性，沒有尷尬的反斜杠來轉義引號，沒有空格，也沒有更多的加號運算符。你寫的正是你希望你的字符串出現的方式。

join() 方法

join() 方法連接數組中的所有元素並返回一個新字符串：

const str = ['Atta', ' ', '🇵🇰'].join('');

console.log(str);
// Atta 🇵🇰

join()的第一個參數 方法是分隔符。如果跳過，逗號 (, ) 用作默認分隔符：

const str = ['Atta', '🇵🇰'].join();

console.log(str);
// Atta,🇵🇰

你可以傳入任何你想組合字符串的分隔符：

const str = ['Atta', '🇵🇰'].join(' ');

console.log(str);
// Atta 🇵🇰