jQueryで文字列を結合する方法をサンプルコード付き解説！
今回はJavaScript(jQuery)で文字列を結合する方法を解説します。サイトの訪問者によって表示を変えたり、動的に表現するにはCSSだけではなく、JavaScriptを用いる必要があります。そこで今回はjQueryで文字列を結合する方法を解説します。
jQueryで文字列を結合する
今回はJavaScript(jQuery)を用いて文字列を結合する方法を解説します。
普段のコーディングで使用する場面はあまり多くないかもしれませんが、必要になったときにすぐ扱えるようにぜひ学習してください。
jQueryで文字列を結合する方法
+演算子を使う方法
JavaScriptで文字列を連結するには「+」演算子を使います。
文字列を追加するというシンプルな方法です。
以下のサンプルコードのように文字列同士の連結はもちろん、文字列と数字の連結も行うことができます。
また、サンプルコード上のgetElementById関数はJavaScriptの文字列を表示するためのコードとなりますので今回は無視してください。
+=演算子を使う方法
次は「+=」演算子を使う方法です。
+=
/*以下２文は同じ意味を持つ*/
text = text + "hogehoge";
text += "hogehoge";
以下のサンプルコードをご覧ください。
concatメソッドを使う方法
concatメソッドは引数を増やすことができ、増やした分結合されます。
またconcatは結合という意味を持ちます。
使用方法は以下のサンプルコードをご覧ください。
今回の例では、a,bという変数のほかに２つの引数を追加しました。
テンプレート文字列を使う方法
テンプレート文字列を使用することで、文字列の中に変数を表示することができます。
これを変数展開と呼びます。
変数展開の際には文字列を`(バッククォート)で囲む必要があり、"(ダブルクォーテーション)などでは動作しません。
joinメソッドを使う方法
joinメソッドは配列の文字列を結合する方法です。
以下のサンプルコードをご覧ください。
まとめ
ここまで文字列を結合する様々な方法を解説しました。
こちらの記事では、これらの速度差を比較しています。
ぜひ合わせてご覧ください。
