[Javascript] 객체 확장 표현식

ES2015가 도입되며 객체의 표현에서 간결한 문법들을 많이 지원하게 되었습니다.

---

1.키 이름과 값이 같은 경우

기존에 키 이름과 키 값이 동일한 경우에도 {키 이름: 키 값}으로 묶어서 표현했었습니다.

let a = 1;
let b = 1;
let obj = { a: a, b: b };

 

이런 경우에 ES2015에서는 다음과 같이 표현할 수 있게 되었습니다.

let a = 1;
let b = 1;
let obj = { a, b };

위의 경우처럼 키 값을 생략하게 되면 키의 이름을 통해 키 값을 지정하게 됩니다.

즉, 객체 변수 obj에 대입된 a와 b는 키의 이름이고, 이 이름을 통해 키 값 a=1 , b=1을 지정해 줍니다.

 

 

 

2. 계산된 키 값 넣기

계산된 키 값을 넣을 때 이전 버전에서는 키 값을 지정해주는 코드를 따로 작성해야 했었습니다.

let str = 'ar';
let obj = {};

obj['c' + str] = 'truck';

ES2015 이후 버전에서는 객체를 생성하고 중괄호 블록 내부에 대괄호를 이용해 바로 계산된 키 값을 넣을 수 있게되었습니다.

let str = 'ar';
let obj = {
	['c' + str]: 'SUV',
};

 

 

 

 

3. 객체에 함수 포함시키기

객체에 함수를 포함시키기 위해서는 변수에 함수 리터럴을 담고 function 명령을 이용해 선언했습니다.

let obj = {
	funcInObject: function() {
    	return console.log('개구리');
    }
};

 

그러나 바로 메소드 형태로 선언하고 function 명령 없이 선언이 가능해졌습니다.

let obj = {
	funcInObject() {
    	console.log('두꺼비');
    }
};

---