Template Literals

ES(ECMAScript의 약자!) : JS 표준, 규격을 나타내는 용어이다!

뒤에 숫자는 버전을 뜻하고 ES5는 2009년 ES6는 2015년 출시!!

그 ES6에서 새로운 문자열 표기법을 도입하였는데 그것이 템플릿 리터럴(Template Literals) 이다.

템플릿 리터럴은 일반 문자열과 비슷해 보이지만 ‘ or“ 같은 통상적인 따옴표 문자 대신 `백틱 `` 문자를 사용!

const template = `템플릿 리터럴은 '작은따옴표(single quotes)'과 "큰따옴표(double quotes)"를 혼용할 수 있다.`;

console.log(template);

일반적인 문자열은 줄바꿈은 허용되지 않는다고 하며, 공백을 표현하기 위해 백슬래시 로 시작하는 이스케이프 시퀀스 를 사용하여야 한다고 한다.

하지만 템플릿 리터럴은 일반적인 문자열과 달리 여러 줄에 걸쳐 문자열을 작성할 수 있고 안에 있는 모든 공백이 있는 그대로 적용된다!!

업그레이드 된 문자열🔥

템플릿 리터럴은 + 연산자를 사용하지 않아도 간단한 방법으로 새로운 문자열을 삽입할 수 있는 기능을 제공한다. 이를 문자열 인터폴레이션(String Interpolation) 이라고 한다.

const first = 'Ung-mo';
const last = 'Lee';

// ES5: 문자열 연결
console.log('My name is ' + first + ' ' + last + '.');
// "My name is Ung-mo Lee."

// ES6: String Interpolation
console.log(`My name is ${first} ${last}.`);
// "My name is Ung-mo Lee."

주의 : 문자열 인터폴레이션 내의 표현식은 문자열로 강제로 타입 변환된다!!