テンプレートリテラルで文字連結
テンプレートリテラルで文字連結:
いまさら感がありますが、テンプレートリテラルについてです。
実際に使うと、その便利さがよくわかります。
「`」(バッククォート)で囲みます。
・改行や複数行を表現できます。
テンプレートリテラルでない場合、
・変数や計算式が書けます。
今までだと、
テンプレートリテラルを使用すると非常に簡単に対応できます。
・エスケープは
・
単なる連結の簡略化として使う分にはマイナスは無いかと思います。
IEがだめだったと思いますが、そのくらいです。
ただ、こちらにある「マニアック」といくつか弱点があります。
https://qiita.com/kura07/items/c9fa858870ad56dfec12
テンプレート文字列:
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/template_strings
JavaScript の テンプレートリテラル を極める!:
https://qiita.com/kura07/items/c9fa858870ad56dfec12
いまさら感がありますが、テンプレートリテラルについてです。
これは何
組み込み式を扱うことができる文字列リテラルこれだけですと「何が違うの」となりそうですが、「組み込み式」がポイントだと思います。
(引用元:https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/template_strings)
実際に使うと、その便利さがよくわかります。
どう使うの?
「`」(バッククォート)で囲みます。const text = `hoge`;
出来る事
・改行や複数行を表現できます。テンプレートリテラルでない場合、
+
などで連結させる必要があります。・変数や計算式が書けます。
const text = 'hoge'; const texts = `${text},huga,piyo`; // 出力結果:hoge,huga,piyo
+
や、配列とjoin()
で文字列を連結させ、また変数を展開していましたが、テンプレートリテラルを使用すると非常に簡単に対応できます。
・エスケープは
\
が使えます。・
String.raw
~``で、未加工(エスケープされていない)の文字列が出力されます。
注意する事
単なる連結の簡略化として使う分にはマイナスは無いかと思います。IEがだめだったと思いますが、そのくらいです。
ただ、こちらにある「マニアック」といくつか弱点があります。
https://qiita.com/kura07/items/c9fa858870ad56dfec12
参考
テンプレート文字列:https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/template_strings
JavaScript の テンプレートリテラル を極める!:
https://qiita.com/kura07/items/c9fa858870ad56dfec12
コメント
コメントを投稿