[ES6] 템플릿리터럴 Template literals

템플릿리터럴 (Template literals)은 무엇인가?

• 템플릿 리터럴은 자바스크립트 표현식을 사용해서 문자열을 연결하고 새로운 문자열을 생성하는 간단한 문법입니다
  • 1. 템플릿 리터럴은 이중 따옴표 나 작은 따옴표 대신 백틱( ` ) (grave accent) 을 이용합니다.
    2. 변수나 코드를 표현할 때는 ${}의 중괄호로 감싸줍니다.

function greet (name) {
  return `Hi, ${name}`
}
greet('hyuk')    // Hi, hyuk

이어서,
흔히 볼 수 있는 URL 표현을 한 번 해보겠습니다.

1. Template literals를 사용하기 전

    function generateLink (image, width) {
     const widthInt = parseInt(width , 10)
     return 'https://' + getProvider() + '/' +image + '?width=' + widthInt;
    }

2. Template literals 사용 후

    function generateLink (image, width) {
     return `https://${getProvider()}/${image}?width=${parseInt(width,10)}`
    }

코딩하기도 쉽고 읽기도 편해졌습니다!!

템플릿리터럴은 JS에서 가장좋은 문자열 표현방법인 것 같습니다.
${} 부분만 유의해서 읽으면 되니까요
감사합니다~