[JavaScript] 자바스크립트 문자다루기 template literals,tagged literals

1. template literals (backquote, backtick)을 사용하는 이유

1. 문자 중간 엔터키 입력이 가능

var 문자 = `안녕
하세요`;

2. 문자 중간에 변수를 집어넣을 때 편리

var 이름 = '손흥민';
var 문자 = `안녕하세요 ${이름} 입니다`;
var 템플릿 = `<div>${변수명}</div>`;

 

2. tagged literals 

S6는 tagged literals라고 해서 함수로 문자 해체분석기능을 만들어줄 수 있음

var 변수 = '손흥민';

function 해체분석기(문자들, 변수들){
  console.log(문자들);
  console.log(변수들);
}

해체분석기`안녕하세요 ${변수} 입니다`;

// ['안녕하세요 ', ' 입니다', raw: Array(2)]
// 손흥민

---

CASE

var pants = 20;
var socks = 100;
`바지${pants} 양말${socks}`;

Q. `양말20 바지100`으로 바꾸려면? 

function a(문자들,변수들1,변수들2){
console.log(문자들[1]+변수들1+문자들[0]+변수들2)
}

a`바지${pants} 양말${socks}`

Q.바지가 0개면 '바지다팔렸어요'라는 문자를 대신 표시하려면?

function a(문자들,변수들1,변수들2){
if(변수들1 = 0){
console.log(`바지다팔렸어요 양말`+변수들2)
}
console.log(문자들[1]+변수들1+문자들[0]+변수들2)
}

a`바지${pants} 양말${socks}`