본문 바로가기

JavaScript/Modern JavaScript

[JavaScript] 모던한 프로퍼티 표기법

객체의 프로퍼티를 표현할때 보통 다음과 같이 표기함.

 

const user = {
  title: 'Codeit',
  birth: 2017,
  job: '프로그래밍 강사'
}

이처럼 변수에 할당된 값을 이용해 다음과 같이 프로퍼티를 만들 수도 있는데,

 

const title = 'Codeit';
const birth = 2017;
const job = '프로그래밍 강사';

const user = {
  title: title,
  birth: birth,
  job: job,
};

 

변수의 이름과 프로퍼티 네임이 똑같으면 다음처럼 하나만 표현하는 방식이 가능함.

 

const title = 'Codeit';
const birth = 2017;
const job = '프로그래밍 강사'

const user = {
  title,
  birth,
  job,
};

메소드를 작성할 때도, 다음과 같이 function 키워드를 생략할 수 있음.

const user = {
  firstName: 'Tess',
  lastName: 'Jang',
  getFullName() { //getFullName : function () {
    return `${this.firstName} ${this.lastName}`;
  },
};

console.log(user.getFullName()); // Tess Jang

다음 코드처럼 대괄호를 이용하여 프로퍼티 네임을 작성할 수 있음.

const propertyName = 'birth';
const getJob = () => 'job';

const codeit = {
  ['topic' + 'name']: 'Modern JavaScript',
  [propertyName]: 2017,
  [getJob()]: '프로그래밍 강사',
};

console.log(codeit);