오늘의 공부 👍

오늘은 ES6의 특징에 대해 다룰 때 잠깐 언급했던 Template Literals에 대해서 알아보겠습니다.

📝 Template Literals

• 내장된 표현식을 허용하는 문자열 리터럴입니다.

• 이중 따옴표나 작은 따옴표 대신 백틱( ` )을 사용합니다.

• 템플릿 리터럴 안에서 백틱 문자를 사용하려면 백틱 앞에 백슬러쉬()를 넣어야 합니다.

  	`\`` === "`" // --> true

• 플레이스 홀더를 이용하여 표현식을 넣을 수도 있는데, $ { }로 표기합니다.

• + 연산자를 사용하지 않아도 간단한 방법으로 새로운 문자열을 만들 수 있습니다. 이를 문자열 인터폴레이션(String)이라고 합니다.

  const qqq = '치킨'
  const www = '피자'
  console.log(`내가 좋아하는 음식은 ${qqq}이고 두번째는 ${www}이다`)
  // '내가 첫번쨰로 좋아하는 음식은 치킨이고 두번째는 피자이다'

• 문자열 인터폴레이션은 ${ … }으로 표현식을 감싸고, 문자열 인터폴레이션 내의 표현식은 문자열로 타입이 변환됩니다.

마무리 👍

이렇게 Template Literals에 대해서 알아봤습니다. 자료를 찾아보게 알게 된 내용은 Template Literals은 문자열 리터럴이고, + 연산자를 활용하지 않고도 문자열을 만들 수 있다는 점이 신기했던 것 같습니다.

블로그를 적으면서 참고한 사이트
참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals
참고 : https://poiemaweb.com/es6-template-literals