ES6(ES2015) テンプレート文字列の使い方のサンプル

2024年3月30日

環境
Google Chrome　123.0.6312.86（Official Build） （64 ビット）
Windows 11 Pro 64bit

概要
“（バッククオート）で文字列を囲むと、${}で文字列内に変数展開ができ、改行も反映できる。
従来の文字列での構文より簡潔かつ明瞭に記述できます。

使用例
従来の文字列での構文

const name = 'tokyo';

console.log('city name ' + name); // => city name tokyo
console.log("city name " + name); // => city name tokyo

テンプレート文字列での構文

const name = 'tokyo';

console.log(`city name ${name}`); // => city name tokyo
console.log(`city
name
${name}`); // => city
           //    name
           //    tokyo