본문 바로가기

WEB/JavaScript

[JavaScript] 템플릿 문자열

템플릿 문자열(Template literals)은 내장된 표현식을 허용하는 문자열 리터럴을 말한다.

템플릿 문자열의 사용법은 다음과 같다.

 

`string text ${expression} string text`

보다시피 큰 따옴표나 작은 따옴표 대신 백틱(` `)을 이용한다. 템플릿 문자열은 플레이스 홀더를 이용하여 표현식을 넣을 수 있는데, 이는 $와 중괄호를 이용하여 표기가 가능하다.

 

간단한 예제를 몇 개 살펴보자.

 

`표현식 273 + 52의 값은 ${273 + 52}입니다...!`
'표현식 273 + 52의 값은 325입니다...!'

 

    <script>
      const rawInput = prompt("inch 단위의 숫자를 입력해주세요.");

      const inch = Number(rawInput);
      const cm = inch * 2.54;

      alert(`${inch}inch는 ${cm}cm입니다.`);
    </script>

 

var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."

'WEB > JavaScript' 카테고리의 다른 글

[JavaScript] NaN (Not a Number)  (0) 2022.07.03
[JavaScript] 키워드와 식별자  (0) 2022.06.29
[JavaScript] 입력 (prompt, confirm)  (0) 2022.03.07
[JavaScript] 증감 연산자  (0) 2022.03.07
[JavaScript] '=='와 '==='의 차이  (0) 2022.03.07