JavaScriptで2つ以上の文字列を結合する方法

JavaScriptを使用して2つ以上の文字列を結合する方法を学びます。

JavaScriptには、プラス演算子+など、2つ以上の文字列を結合するさまざまな方法があります。 、プラスは+=に等しい 演算子、およびconcat() 。

注：+ および+= 代入演算子として知られています。

3つすべて試してみましょう！

プラス演算子（+）

firstNameという2つの変数があるとします。 およびlastName 、およびこれらの変数の合計値をfullNameと呼ばれる3番目の変数に割り当てます。 。あなたはこのようにそれをすることができます：

const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + lastName

console.log(fullName) // SteveJobs

分離（スペース）を追加

fullNameを作成するには 文字列値を読みやすくします。SteveとJobsの間にスペースを追加しましょう。以前と同じコードを再利用しますが、今回は+ '' +の間にセパレータを追加します 、このように：

const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + " " + lastName

console.log(fullName) // Steve Jobs

注："Steve "の後にスペースを追加して、区切り文字を追加することもできます または" Jobs"の前 ただし、firstNameの使用を計画している場合は、他のフォーマットの問題が発生する可能性があります。 またはlastName プロジェクト内の異なるコンテキストの変数。したがって、そのアプローチはお勧めしません。

プラスに等しい演算子（+ =）

なんらかの理由で新しい変数（fullNameを作成したくない場合 ）lastNameを割り当てることができます firstNameへの変数 プラス等号演算子+=を使用する ：

console.log((firstName += lastName))
// SteveJobs

ただし、ご覧のとおり、ここでもセパレータが必要です。 +=で複数の値を追加するには これが可能だと思うかもしれないオペレーター：

firstName += " " += lastName

しかし、それはあなたにエラーを投げます：

Uncaught SyntaxError: Invalid left-hand side in assignment

代わりに、別々の行で値を組み合わせる必要があります。まず、スペースセパレータをfirstNameに割り当てます 、次にlastNameを割り当てます firstNameへ その後：

let firstName = "Steve"
let lastName = "Jobs"

// First assign separator value
firstName += " "
// Then assign last name
firstName += lastName
// Result: Steve Jobs

concat（）メソッド

JavaScriptを使用して文字列を結合することもできますconcat() 方法：

let firstName = "Steve"
let lastName = "Jobs"

const fullName = firstName.concat(lastName)

console.log(fullName)
// SteveJobs

繰り返しになりますが、セパレータが必要です。 concat()を使えば簡単です 。文字列とカンマを含むスペースを追加し、その後にlastNameを追加するだけです。 変数：

const fullName = firstName.concat(" ", lastName)
console.log(fullName)
// Steve Jobs

文字列を結合するためにどのメソッドを使用する必要がありますか？

パフォーマンス上の理由から、Mozillaおよび他の多くの信頼できるJSソースは、+の使用を強くお勧めします。 または+= 可能な限り。

このJSPerfテストケースが示すように、concat()のような文字列オブジェクト +のような文字列プリミティブよりもJavaScriptインタープリター（ブラウザーで実行される）の方がはるかに低速です および+= ：