Javascript - ES6 템플릿 문자열

1. 템플릿 문자열

• ES6에서 추가된 새로운 문자열 선언 방식을 말하며, 백틱(``)이라고 한다
  • ES6란?
    • 2009년에 ECMAScript 5(ES5 또는 ES2009) 버전을 발표했던 Ecma International은 2015에 ECMAScript 6 개정판을 발표하는데 이를 줄여서 ES6 라고 부른다. (ES6 = ECMA Script6)
  • 1) 보통 문자열(일반형)

    let str = "I'm Fine Thank You!";
    console.log(str);
    
    let str2 = '"시작이 반이다!"';
    console.log(str2);
    
    let str3 = "\"여러분, '시작이 반이다' 라는 말 들어보셨죠?\"";
    console.log(str3);

  • 2) 템플릿 문자열(백틱 : ``)

    let str4 = `"I'm Fine Thank You!"`;
    console.log(str4);
    
    let str5 = `"시작이 반이다"`;
    console.log(str5);
    
    let str6 = `"여러분, '시작이 반이다' 라는 말 들어보셨죠?"`;
    console.log(str6);

    • MacBook 단축키 : option + ₩
  • 3) 템플릿 문자열(${})

    let name1 = `영희`;
    let name2 = `철수`;
    
    let str7 = `${name1}는, ${name2}를 좋아합니다.`
    console.log(str7);

    • Tip.
      • 템플릿 문자열은 구버전 브라우저(IE)에선 지원되지 않아서 구버전 브라우저에도 사용하려면 바벨(babel)과 같은 모듈을 사용해야 함