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

oldObjectnewObject를 비교하면서 살펴보세요. sayJS 같은 객체의 메서드에 함수를 연결할 때 더는 콜론(:)과 function을 붙이지 않아도 됩니다.

sayNode: sayNode처럼 속성명과 변수명이 동일한 경우에는 한 번만 써도 되게 바뀌었습니다. 자바스크립트에서 다음과 같은 경우가 많이 나오는데, 이때 코드의 중복을 피할 수 있어 편리합니다.

{ name: name, age: age } // ES5
{ name, age } // ES2015

객체의 속성명은 동적으로 생성할 수 있습니다. 예전 문법에서는 ES6라는 속성명을 만들려면 객체 리터럴(oldObject) 바깥에서 [es+6]를 해야 했습니다. 하지만 ES2015 문법에서는 객체 리터럴 안에 동적 속성을 선언해도 됩니다. newObject 안에서 [es + 6]가 속성명으로 바로 사용되고 있습니다.

객체 리터럴에 추가된 문법은 코딩의 편의성을 향상시키고자 만들어진 것이라는 느낌이 강합니다. 따라서 익숙해지면 코드의 양을 많이 줄일 수 있습니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.