2021年12月01日 更新

JSのテンプレート文字列

どうも、クラゲジュニアです。

今回は、文字列に変数を含めたいときに簡潔に記述できるテンプレート文字列についてです。
テンプレート文字列は、ECMAScript２０１５から使用可能です。

従来の方法

let myName = 'Taro';
let myAge = 15;
console.log('My name is ' + myName + '. ' + "I'm " + myAge + 'years old.');

テンプレート文字列を利用

let myName = 'Taro';
let myAge = 15;
console.log(`My name is ${myName}. I'm ${myAge}years old.`);

テンプレート文字列を利用した方がスッキリします。

シンタックス

• バッククォート``で文字列全体を囲う
• 変数部分は、${}で囲み、${変数名}という形式にする

以上です。