[자바스크립트] ES6+ Template Literals

여러 줄 문자열 (Multi-line String)

탬플릿 리터럴을 사용하면 여러 줄의 문자열을 간편하게 작성할 수 있다. 이전에는 줄 바꿈 문자를 사용하여 여러 줄을 나눠야 했지만, 템플릿 리터럴을 이용하면 백틱 문자 '를 이용하여 손쉽게 작성할 수 있다.

아래의 예제처럼 작성하게 되면 줄 바꿈과 들여쓰기는 그대로 유지된다.

const multiLineString = `
    This is
    a multi-line
    string.
`;

console.log(multiLineString);

 

문자열 보간 (String Interpolation)

문자열 보간은 템플릿 리터럴을 사용하여 변수나 표현식을 문자열 안에 삽입하는 기능이다. 이전에는 문자열을 연결할 때 '+' 연산자를 사용했지만, 템플릿 리터럴을 사용하면 보다 간편하게 문자열을 조립할 수 있다.

아래의 예저처럼 '&{ }' 안에 변수나 표현식을 넣어주면 해당 부분이 그 값으로 대체된다. 

const name = 'jongseoung';
const age = 25;

const greeting = `Hello, my name is ${name} and I am ${age} years old.`;

console.log(greeting);