[Javascript] 템플릿 리터럴

한효찬·2024년 9월 6일

[공부] Javascript

목록 보기
5/24

템플릿 리터럴(Template)은 문자열을 표현하는 또 다른 방법으로 따옴표와 비슷한 역할을 하지만 장점을 더 채운 문법이다. 백틱(``)을 사용하여 그 안에 데이터를 채운다.

esg 이전에는 템플릿 문자열로 불렸으나 esg 이후에 템플릿 리터럴이라 불리게 되었다.
문자열 삽입, 여러 줄 문자열, 문자열 형식화, 문자열 태깅 등 다양한 기능을 제공하며 기존 따옴표의 단점을 보완하고 장점을 추가했다고 보면 된다.

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

//백틱을 사용한 템플릿 리터럴
const str3 = `이게 백틱입니다`

기존 따옴표에서는 문자열을 붙여서 쓸 때도 + 기호를 사용하거나 번거로운 과정을 거쳤지만
템플릿 리터럴은 편리하게 문자열을 붙이고 중간에 데이터를 삽입할 수 있는 플레이스홀더($[])를 기입할 수 있다.

      const data = `데이터`;
      const prompt1 = prompt(
        `백틱을 사용하면 문자열 중간에 ${data}를 삽입할 수  있습니까?`
      );
      console.log(prompt1);

그리고 데이터를 반환하는 메소드 또한 데이터와 같이 취급할 수 있다.

    const str1 = `백틱은 유용한가? ${prompt("정말 그런가?")}]`
    console.log(str1);

먼저 prompt함수를 백틱에 넣어 변수로 할당하고 console로 띄웠을 때,

문자열을 입력한 뒤 console을 확인하면
그대로 값이 뜬 것을 확인할 수 있다.

profile
hyohyo

0개의 댓글