본문 바로가기

ECMAScript 2015, ECMAScript 6th Edition

8. Enhanced Object ProPerties

Property Shorthand

let one =1, two = 2;
let values = {one, two};
console.log(values);
//Object
//  one:1
//  two:2

선언한 variable 의 name 이 key 값으로 대체되는 것을 알 수 있다.



Computed Property Names

function quux() {
	return 'quux';
}
let obj = {
    foo: "bar",
    [ "baz" + quux() ]: 42
}
console.log(obj);

//Object {foo: "bar", bazquux: 42} 출력

Object 의 Property Name 설정시 대괄호 ( [] ) 를 치고 그 안에 값을 적으면 그 값들이 미리 Computed 된 값으로 대체되서 인식된다.




Method Properties

let obj = {
    foo (a, b) {
    	return a+b;
    },
    bar (x, y) {
    	return x*y;
    },
    *quux (x, y) {
    	yield x + y;
    	yield 20;
    }
}

console.log(obj.foo(1,10));
console.log(obj.bar(1,10));

let result = obj.quux(1,10);

console.log(result.next());
console.log(result.next());
console.log(result.next());
// 11
// 10
// Object {value: 11, done: false}
// Object {value: 20, done: false}
// Object {value: undefined, done: true}

위의 예제는 2가지를 보여준다. 

1. 기존에 함수 선언할 때엔 foo : function(a, b) { ... } 이런 식이 되야 하나 이제 function 이란 글자를 생략하고 object property 가 function object 인 경우 바로 위처럼 선언이 가능하다.


2. object 안에 generator 함수도 선언이 가능하다. 아직 generator 함수에 대해서는 배우지 않았으니 이게 먼데...? 라는 의문은 잠시 뒤로 미뤄두자!! :)




'ECMAScript 2015, ECMAScript 6th Edition' 카테고리의 다른 글

10. Object assign  (0) 2016.09.27
9. for of  (0) 2016.09.25
7. destructuring  (0) 2016.09.13
0. 김영보 선생님 강의 후기  (0) 2016.09.11
6. Array-like  (0) 2016.09.07