Template Literals

Template Literals ?

• ES6 부터는 문자를 조합할 때 (backtick) 문자 를 이용해서 쉬운 처리가 가능해짐
• 변수를 넣을때는 place holder (S{})를 사용함

'string text line 1' = 기존
'string text line 2' = 기존

`string text line ${one}` = 템플릿 리터럴
`string text line ${two}` = 템플릿 리터럴

**위와 같이 템플릿 리터럴은 작은 따옴표나 큰 따옴표 대신 백틱(`)으로 감싸준다**

템플릿 리터럴을 활용한 멀리 라인 스트링

// Untagged, these create strings:
`string text`

`string text line 1
 string text line 2`

`string text ${expression} string text

특징

• 일반적인 문자열에서 줄바꿈은 허용되지 않으며 공백(white-space)를 표현하기 위해서는 백슬래시()로 시작하는 이스케이프 시퀀스(Escape Sequence)를 사용하여야 한다.
• ES6 템플릿 리터럴은 일반적인 문자열과 달리 여러 줄에 걸쳐 문자열을 작성할 수 있으며 템플릿 리터럴 내의 모든 white-space는 있는 그대로 적용된다.

(영문 해석)

What is Template Literals?

• Template literals are literals delimited with backtick (`) characters, allowing for multi-line strings, string interpolation with embedded expressions, and special constructs called tagged templates.

• Template literals are sometimes informally called template strings, because they are used most commonly for string interpolation (to create strings by doing substitution of placeholders). However, a tagged template literal may not result in a string; it can be used with a custom tag function to perform whatever operations you want on the different parts of the template literal.

Source:
https://www.programiz.com/javascript/template-literal
https://www.w3schools.com/js/js_string_templates.asp
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals