javascript ${}(テンプレートリテラル)の使い方

javascript ${}(テンプレートリテラル)の使い方

javascriptで、変数を文字列内に埋め込むことができる、${}(テンプレートリテラル)の使い方を記述してます。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 102.0.5005.115

${}(テンプレートリテラル)使い方

${}(テンプレートリテラル)を使用すると、以下のように、変数を文字列内に埋め込むことが可能です。

let hoge = 'mebee';
let str = `このサイトの名前は${hoge}です`;
console.log(str);

実行結果

計算結果も扱うことができます。

let result =  `1 + 2 = ${1 + 2}`;
console.log(result);

実行結果

関数も使用可能です。

function hello() { return 'hello'; }

let result = `${hello()}`;
console.log(result); // hello

ただし、${}(テンプレートリテラル)は、IEだとエラーになるので使えません。