Template String(템플릿 문자열)-백틱

Template String(템플릿 문자열)-백틱

변수에 템플릿 문자열 삽입 후 사용 가능

let story = `Hello, World! I'm "24"`
console.log(story) // Hello, World! I'm "24" 출력

위와 같이 변수 뒤에 내용들을 `(grave accent)로 감싸면 공백, 따옴표 등 작성한 그대로 출력할 수 있음

템플릿 문자열 안에 변수 삽입 가능

const a = "takeU";
const b = 24;

ES5에서는 위에서 선언한 상수 a,b를 문자열 안에 출력하려면 아래와 같이 작성했다.

console.log("Hello " + a + " I'm " + b + " year's old")

보는것과 같이 띄어쓰기도 일일이 해야하고 +로 이어줘야 하므로 번거롭다.
하지만 ES6는 아주 편하게 할 수 있음.

console.log(`Hello ${a} I'm ${b} year's old`)

이처럼 `에 넣어주고 변수는 ${}사이에 넣어주면 위와 같은 결과를 얻을 수 있다.
1번에서 설명한 것과 같이 공백과 따옴표도 그대로 출력이 되어 간단하게 사용할 수 있다!

출처: https://takeuu.tistory.com/89 [워너비스페셜]