Written by Kasumi

JavaScriptで文字列と変数を組み合わせて出力する二つの方法

JavaScriptで文字列と変数を組み合わせて出力したい。

本記事ではこのような悩みを解決します。

文字列と変数を組み合わせる方法

const val = 10;
const target = 5;
const answer = val + target;

console.log(val + "+" + target + "=" + answer);

// コンソール結果
//10+5=15

文字列と変数を組み合わせるコード例です。

console.logで、コンソールに組み合わせ結果を出力してます。

組み合わせには結合演算子(+)を使います。

使い方は以下の通りです。

変数 + “文字列”+ 変数 + “文字列”

変数と文字列の間を+で連結する事で、組み合わせが可能になります。

テンプレート文字列を使って変数と組み合わせる

const val = 10;
const target = 5;
const answer = val + target;

console.log(`${val} + ${target} = ${answer}`);

テンプレート文字列を使って、変数と組み合わせるコード例です。

テンプレート文字列の使い方は以下の通りです。

`${変数} 文字列 ${変数} 文字列 `

組み合わせたい変数と文字列をバッククォート(`)で囲います。

バッククォートの入力はshift + @とキーボードで打つ事で表示されます。

変数名を${ }で囲み、文字列の中に埋め込みます。

以上がテンプレート文字列を使った変数と文字列の組み合わせ方法です。

まとめ

JavaScriptで文字列と変数を組み合わせて出力する二つの方法について紹介しました。

以上で解説を終わります。

目次

関連記事

JavaScript

【簡単】JavaScriptを使ってhtmlタグを取得し、値を出力・書き換える方法

更新日:2022.09.09
2064
JavaScript

【JavaScript】初回アクセスのみ任意の処理を実行する方法

2022.12.18
3301
JavaScript

JavaScriptでHTMLタグに属性を追加する方法

2023.01.08
6929
JavaScript

JavaScriptで上下のスクロールを判定する方法

2022.10.15
3703