javaScript 템플릿 리터럴

한 줄 정리

-``를 문장 처음과 끝에 사용해주면 준간에 ${} 플레이스 홀더를 사용해서 문구 추가가 가능하다.

-let template  = "좋아요"

-let youtube =  `구독과 ${template}는 사랑입니다.`

 

 

 

---

 

## 템플릿 리터럴 (문장 부분에 단어 추가)

 

-기존의 문자열은 따옴표를 사용했지만 템플릿 리터럴은 백틱을 사용한다.

-템플릿 리터럴은 표현식을 내장할 수 있는 문자열 표현 방식이다.
 (문자열 내용에 데이터를 삽입할 수 있다.)

-템플릿 리터럴로 표현한 문자열에 플레이스홀더( ${ } )를 사용하여 새로운 데이터를 삽입할 수 있다.
-플레이스홀더( ${ } )안에 문자열을 입력하면 해당 문자열은 템플릿 리터럴 문자에 적용된다.

 

-일반적인 코드 사용

let str = '홑 따옴표를 사용한 문자열';
let str2 = "쌍따옴표를 사용한 문자열";
let str3 = `백틱을 사용한 문자열`; // 1옆에 있는 문자 (`)

console.log(str);
console.log(str2);
console.log(str3);

 

-템플릿 리터럴로 추가 데이터 적용

let data = "데이터";
let str = `문자열안에 ${data} 삽입합니다.`;
console.log(str);

 

let str = `다이얼로그로 입력받은 값 : ${ prompt("값을 입력하세요")}`;

console.log(str);

 

 

let backNumber = 7;
let playerName = "손흥민";

let result = `한국의 ${playerName}은 등번호 ${backNumber}번을 달고 뜁니다.`;

console.log(result);
console.log(`한국의 ${playerName}은 등번호 ${backNumber}번을 달고 뜁니다.`);

 

 

-위와 아래 전부 결과가 동일한 똑같은 코드다.

let bestPlayer = window.prompt("가장 좋아하는 선수는?");
let bestTeam = window.prompt("가장 좋아하는 축구 팀은?");
let best = `당신이 가장 좋아하는 선수는 ${bestPlayer}이며, 당신이 가장 좋아하는 축구 팀은 ${bestTeam}입니다. 맞습니까?`

console.log(best);

let best2 = `당신이 가장 좋아하는 선수는 ${prompt("가장 좋아하는 선수는?")}이며, 가장 좋아하는 팀은 ${prompt("가장 좋아하는 팀은?")}입니다.`
console.log(best2);