A3 Code Note

07/11/2023

テンプレート文字列

const breakfast = "お茶漬け"
console.log("今日の朝ごはんは" + breakfast + "でした。") //=> 今日の朝ごはんはトーストでした。

上記のように+で文字を繋げると、少し記述が冗長です。バッククオート(`)で囲む特殊な書き方の文字列を使うと、もう少し簡単に書けます。

const breakfast = "納豆ごはん"
console.log(`今日の朝ごはんは${breakfast}でした。`) //=> 今日の朝ごはんは納豆ごはんでした。
console.log(`8 + 7 = ${8 + 7}`) //=> 8 + 7 = 15

${〜}のところに、文字列の中に入れたい値や変数を書きます。この書き方の文字列をテンプレート文字列と呼びます。

多くのキーボードでは、バッククオートはShift + @で入力できます。
テンプレート文字列では、改行がそのまま書けるという特徴もあります('"で囲んだ文字列ではできません)。

const html = `
<div class="container">
  <p>test</p>
</div>
`