情報アイランド

「情報を制する者は世界を制す」をモットーに様々な情報を提供することを目指すブログです。現在はプログラミング関連情報が多めですが、投資関連情報も取り扱っていきたいです。

ECMAScript 6の新機能(6)テンプレートリテラル

2016/05/27

ECMAScript 6でテンプレートリテラルという新しい文字列リテラルが追加されました。

テンプレートリテラルは複数行の文字列をそのまま記述することができ、インターポレーションに対応しています。

テンプレートリテラルを使用するには文字列を` で囲みます。

C:\work\node>node
> `
... this
... is
... multi line
... text.
... `
'\nthis \nis \nmulti line \ntext.\n'

テンプレートリテラル中の改行は全て\nで表されます。

インターポレーションを使用するにはテンプレートリテラル中で式を${}で囲みます。

> var foo = 100
undefined
> var bar = 200
undefined
> `foo + bar = ${foo + bar}`
'foo + bar = 300'

式の中でテンプレートリテラルを使用することもできます。

> `${foo + `${foo + bar}` + bar}`
'100300200'

テンプレートリテラル中で${をエスケープするには${の前に\を付加します。

ただし、${の前に\が偶数個連続しているとその最後の\\\の一部と解釈されますので注意してください。

> `${foo}`
'100'
> `\${foo}`
'${foo}'
> `\\${foo}`
'\\100'
> `\\\${foo}`
'\\${foo}'
> `\\\\${foo}`
'\\\\100'

テンプレートリテラルには先頭にタグを付加することができます。

タグにはString.rawがあります。

これはテンプレートリテラル中のエスケープシーケンスをエスケープシーケンスとして扱わず、そのままの文字として扱うためのタグです。

> String.raw`not escaped text: \n\r\\`
'not escaped text: \\n\\r\\\\'
pizyumi
プログラミング歴19年のベテランプログラマー。業務システム全般何でも作れます。現在はWeb系の技術を勉強中。
スポンサーリンク

-ecmascript 2015, ecmascript 6, Javascript