テンプレートリテラル

javascriptのテンプレートリテラルを学んだので、アウトプット。

Template literal は組み込み式を扱うことができる文字列リテラルです。複数行文字列や文字列内挿機能を使用できます。ES2015 / ES6 仕様の以前のエディションでは、"template strings" と呼ばれていました。

`${~}`を使うと、+ を使わずに文字結合をすることができる。
バッククォートで文字列を囲み、変数を使いたい時は${~}で囲む。

const name = 'Taro';
const age = 20;
console.log('私の名前は、' + name + 'です。' + age + '歳です。');

変数を繋げるたびに、+ を使わなければならないし、
文字列に関しては、シングルクォーテーションでいちいち囲わないといけない。
面倒だし見辛い。

const name = 'Taro';
const age = 20;
console.log(`私の名前は、${name}です。${age}歳です。`);

「+」を使う必要がなく、文字列もいちいちシングルクォーテーションで囲む必要がない。
使わない場合と比較して綺麗に見える。

const func = num => num * 2;
console.log('3の2倍の値は' + func(3) + 'です。');
console.log(`3の2倍の値は${func(3)}です。`);

console.log('3の2倍の値は' + 3 * 2 + 'です。');
console.log(`3の2倍の値は${3 * 2}です。`);

`${~}`
これ↑
最初にも書いたが、シングルクォーテーションではなく、バッククォートで囲む必要があるのをお忘れなく。
ちなみに、キーボードでバッククォートのある場所は@があるとこ

Output Place