【JavaScript】テンプレートリテラルの使い方

記事の目的

テンプレートリテラル(テンプレート文字列とも言います)の使い方を紹介します。
テンプレートリテラルは、シングルクォート( ' )やダブルクォート( " )の代わりに、バッククォート( ` )を用います

改行の記述が楽になる

テンプレートリテラルを使わなかった場合、改行を使用するとこのようになります。

console.log(
  "こんにちは\nお元気ですか？\nよろしくお願いします。"
)

こんにちは
お元気ですか？
よろしくお願いします。

テンプレートリテラルを使った場合

console.log(
`こんにちは
お元気ですか？
よろしくお願いします。`
)

こんにちは
お元気ですか？
よろしくお願いします。

書き方はテンプレートリテラルを使ったほうが直感的に分かりやすいですね。

変数と文字列の連結が楽になる。

テンプレートリテラルを使わなかった場合

const num = 2
console.log("私はりんごを" + num + "つ食べたい。") // 私はりんごを2つ食べたい

テンプレートリテラルを使った場合

const num = 2
console.log(`私はりんごを${num}つ食べたい。`) // 私はりんごを2つ食べたい

こちらもテンプレートリテラルを使ったほうが書き方がシンプルですね。

まとめ

以上がテンプレートリテラルの使い方でした！