템플릿 리터럴이란 백틱(``)
을 의미합니다.
기존에는 템플릿 스트링이라고 불리던 것이 ES6이후 템플릿 리터럴이라고 불리게 되었습니다.
템플릿 리터럴은 문자열과 변수를 함께 사용하기 위해 필요합니다.
템플릿 리터럴이 없을때는 아래와 같이 문자열과 변수를 사용하였습니다.
var age = 99;
console.log("age : "+age);
//age : 99
하지만 템플릿 리터럴을 사용하면 아래와 같이 사용할수 있고 문자열 줄바꿈도 가능합니다.
var age = 99;
console.log(`age :
${age}`);
//age :
// 99
탬플릿 태그란 함수에 인자를 넘겨줄때 ()
로 넘겨주는 것이 아니라 백틱``
으로 감싸서 넘겨주는 방식을 의미합니다.
function func(str,...rest){
console.log(str);
if(rest[0] === rest[1]){
console.log(`${rest[0]} == ${rest[1]}`);
}else{
console.log(`${rest[0]} != ${rest[1]}`);
}
console.log(rest[2]);
}
func`co_mong${99}${99}age${true}`;
//["co_mong","","age",""]
//99 == 99
//true
위의 경우와 같이 템플릿 태그를 사용하면 함수에 인자를 좀더 유연하게 넘겨주는 것이 가능합니다.
인자에서 문자열의 경우 str에 저장되는데 문자열간 ${}
가 있는 경우 빈 문자열로 치환되어 저장됩니다.
그리고 ${}
로 감싸진 나머지 인자의 경우 rest에 저장됩니다.
아직 다 이해 못함 공부가 더 필요할 듯😡