Language/JavaScript

[JavaScript] 템플릿 리터럴

Sh-YE 2024. 4. 30. 10:02

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

// 따옴표를 이용한 기존의 문자열
const str1 = '작은 따옴표'
const str2 = " 큰 따옴표"

// 백틱을 이용한 템플릿 리터럴
const str3 = `백틱`

 

 => 백틱 : 물결(~)키를 Shift없이 누르면 입력할 수 있다

 

템플릿 리터럴은 표현식을 내장할 수 있는 문자열 표현법이다.

 ( -> 이는 문자열의 내용에 데이터를 삽입한다는 것을 의미.)

 

템플릿 리터럴로 표현한 문자열 내부에 플레이스홀더(${})를 기입하고, 그 안에 데이터를 기입하면 데이터는 문자열의 멤버가 된다.

 

상수값  콘솔출력

const data1 = "데이터"
const str1 = `문자열 중간에 문자 ${data1} 삽입하기`
console.log(str1)

const data2 = 100
const str2 = `문자열 중간에 숫자 ${data2} 삽입하기`
console.log(str2)

 

 

prompt값 받아 콘솔 출력

console.log (
             `제가 좋아하는 축구선수는 ${prompt("좋아하는 축구선수는?")}, 그의 등번호는 ${21}`
             )