${ 변수명 } String interpolation 문자열 보간이란?

String interpolation (문자열 보간)이란 무엇일까? 

다음과 같은 예시를 살펴보자.

const favoriteAnimal = 'Dog';
console.log(`My favorite animal is ${favoriteAnimal}.`);
// Output: My favorite animal is Dog.

favoriteAnimal이라는 변수에 'Dog'를 할당한 뒤에 $ { 변수이름} 을 써주었더니 변수에 할당되었던 값이 문자열에 들어가 대체되어서 출력되는 것을 볼 수 있다. 

 

이처럼 $ { 변수명 } 의 형식을 사용하면 문장에서 변수에 할당된 값이 들어가 출력되게 된다. 

 

이런 형식을 우리는 영어로 String interpolation, 한국어로 문자열 보간이라고 부르고 javascript에서도 자주 활용되는 방법이다. 

---

이 방식을 사용했을 때 장점은 무엇일까?

바로 변수에 해당되는 값을 유동적으로 String에 넣을 수 있다는 것이다. 

예를 들어 let 키워드를 사용하면 변수의 값이 계속 바뀔 수 있다. 어떠한 값으로 바뀔지 모르기 때문에 우리는 String interpolation을 사용하여 변수에 저장된 값으로 보간을 해주겠다는 뜻이 담겨 있다.

 

let favoriteCity = 'Seoul';
console.log(`My favorite city is ${favoriteCity}.`) //print Seoul
favoriteCity='New York';
console.log(`My favorite city is ${favoriteCity}.`) //print New York

이런식으로 변수의 값이 바뀌어도 우리는 문자열 보간 방식을 통해 변한 값을 업데이트하여 출력할 수 있다.