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】コンストラクター関数を使ってオブジェクトの雛形を作成・インスタンス化する方法

2022.12.12
694
JavaScript

JavaScriptでマウスが要素をhoverしたか判定する方法

2022.11.10
3380
JavaScript

JavaScriptで郵便番号から住所を自動入力する方法【zipcloud APIを使おう】

2023.01.03
7119
JavaScript

JavaScriptで親・兄弟のID・クラス・要素名を取得する方法

2023.01.21
3695