[자바스크립트 기초] 문자열(string)| 변수 합치기

이번시간에는 각 변수에 담은 값들을 우리가 지정한 string(문자열에) 합치는 방법을 알아보겠습니다. 

 

 

 

" " 따옴표와 + 를 이용하여 합치기

const firstName = 'Jonas';
const job = 'teacher';
const birthYear = 1991;
const year = 2037;

const jonas = "I'm " + firstName + ', a ' + (year - birthYear) + ' year old ' + job + '!';
console.log(jonas);

output :

해당코드처럼 우리가 만들고 싶은 문자열은 " " 따옴표를 통해 문자열화 해주고 값을 가지고있는 변수들을 + 와 함께 연결해주면 됩니다. 

 

여기서 우리가 생각해볼 수있는것은

(year - birthYear) 입니다.  이 값은 숫자값 두개를 연산한 값이므로 숫자값입니다. 그런데 문자열과 결합이 가능합니다. 왜냐하면 자바스크립트에서는 자동적으로 문자열과 합칠때 숫자를 string 으로 변환시켜주는 기능이 있기 때문입니다. 

 

위에서 작성한 기능을 조금더 쉬운 방법으로는 `(백틱)을 사용하는 법입니다. 

 

`(백틱)을 이용하여 문자열 합치기

const firstName = 'Jonas';
const job = 'teacher';
const birthYear = 1991;
const year = 2037;


// template literals

const jonasNew = `I'm ${firstName}, a ${year - birthYear} year old ${job}!`; 
console.log(jonasNew);

output :

결과는 똑같습니다. 하지만 코드가 훨씬 간결하지 않나요?

백틱을 이용하여 문자열을 덮어주고, 변수를 이용할 값은 ${변수} 형태로 지정해주면 끝입니다. 

(백틱은 이외에도 multi line 문자열을 만드는데도 사용할수 있는 고마운 친구입니다. )