[04] Template Literals

Template Literalsとは?

JavaScriptに文字列を入力する方法.
ES 6は백틱という記号を用いて定義される
テキストと変数を同時に使用できるツールです.$Stringと変数を演算子として追加する必要がなく、コードを簡単に作成できます.

const str = `Hello ES6`

backticでは、複数行にわたって文字列を定義できます.
JavaScript文字列に直接接続できます

長所

JS文字列は文字の間に入力できませんが、チェックバックを使用して

を入力できます.

文字列の間に変数を挿入できます.

var love = 'You';
var emotion = `I love ${love}!`;
console.log(emotion);
//'I love You!'

は、以下に示すように、文字列と変数を簡単に使用することができる.

var fruit = "apple";

var test1 = "가장 맛있는 과일은" + " " +fruit + " " + "이다.";

console.log(test1)
//'가장 맛있는 과일은 apple 이다.'

var test2 = `가장 맛있는 과일은 ${fruit} 이다.`

console.log(test2)
//'가장 맛있는 과일은 apple 이다.'

Jsを使用してHTMLを作成する場合に便利です.

`<div>${fruit}</div>`

入力した

スペースも出力になります.

var fruit = "apple";

var test3 = `배고파    뭐     먹냐   그건 바로 ${fruit}이다`

console.log(test3)
//'배고파    뭐     먹냐   그건 바로 apple이다'

リファレンス
https://joshua1988.github.io/es6-online-book/template-literal.html#%EC%97%AC%EB%9F%AC-%EC%A4%84%EC%97%90-%EA%B1%B8%EC%B3%90-%EB%AC%B8%EC%9E%90%EC%97%B4-%EC%84%A0%EC%96%B8%ED%95%98%EA%B8%B0