ECMA 스크립트: 객체의 속성을 지정하는 defineProperty

ECMA 스크립트: 객체의 속성을 지정하는 defineProperty

.defineProperty() 메소드: 객체에 새로운 속성을 추가하거나 객체를 수정한 뒤 그 객체를 반환한다.

1. 객체 속성 관련 옵션

value: 객체의 속성 값

writable: 객체의 속성 값 변경 유무 (true/false) . 기본값은 false

get: getter

set: setter

configurable: 속성의 설정 변경 가능 여부 체크. 기본값은 false

enumerable: for in 반복문으로 검사 가능 여부 체크. 기본값은 false

1) 객체 관련 예제 defineProperty 메서드의 사용

<script>

var object = {};

Object.defineProperty(object, 'name', {

value: '홍길동',

writable: true,

enumerable: true

}); 

object.name = '이순신'; // writable이 true이므로 값이 변경 가능하다.

for(var i in object) { // enumarable이 true이므로 반복문 사용 가능

alert(i + ': ' + object[i]);

}

alert(object.name);

</script>

2) 객체 관련 예제 2 getter와 setter

defineProperty 안에 getter와 setter 메서드만 정의해야 한다.

<script>

var object = {};

var value = 'test';

Object.defineProperty(object, 'name', {

get: function(){

alert('getter');

return value;

},

set: function(newValue){

alert('setter');

value = newValue;

}

}); 

object.name = 'ALPHA';

alert(object.name);

</script>

3) 2개 이상의 속성을 추가하는 경우의 예제 .defineProperties()

.defineProperties() : defineProperty와 마찬가지로 사용하나 복수의 속성을 추가할 수 있다.

enumerable은 기본값이 false이므로 반드시 true로 해줘야 한다.

<script>

var object = {};

Object.defineProperties(object, {

name: {value:'홍길동', enumerable: true},

resion:{value:'서울시', enumerable: true}

});

for(var i in object) { 

alert(i + ': ' + object[i]);

}

</script>