템플릿_문자열,객체_리터럴

템플릿 문자열

ES6 전에는 문자 안에 변수를 합치기 위해서는 아래와 같은 방식을 사용해야 했다.

var won = 1000;
var result = '이 과자는 ' + won + '원입니다.';

그러나 ES6 이후에는 `(백틱)을 이용하여 한 문자 안에서 변수를 사용할 수 있게 되었다.

const result = `이 과자는 ${won}입니다.`;

객체 리터럴

ES6 이전 객체를 표현하는 방법은 아래와 같았다.

var sayNode = function() {
  console.log('Node');
};
var es = 'ES';
var oldObject = {
  sayJS: function() {
    console.log('JS');
  },
  sayNode: sayNode,
};
oldObject[es + 6] = 'Fantastic';
oldObject.sayNode(); // Node
oldObject.sayJS(); // JS
console.log(oldObject.ES6); // Fantastic

ES6에서는 간결한 문법으로 객체 리터럴 표현이 가능해졌다.

const newObject = {
  sayJS() {
    console.log('JS');
  },
  sayNode,
  [es + 6]: 'Fantastic',
};
newObject.sayNode(); // Node
newObject.sayJS(); // JS
console.log(newObject.ES6); // Fantastic

• 객체 메서드에 :function을 붙이지 않아도 됨
• { sayNode: sayNode }처럼 key 이름과 value 변수명이 같다면 { sayNode }로 축약 가능
• [변수 + 값] 등으로 동적 속성명을 객체 속성 명으로 사용 가능