자바스크립트

자바스크립트 Object.defineProperty()

세모이 2023. 4. 10. 15:44
반응형

Object.defineProperty()

Object.defineProperty(obj, prop, descriptor) - 객체에 직접 새로운 속성을 정의하거나 이미 존재하는 속성을 수정하고 수정된 객체를 리턴

obj - 속성을 정의할 객체.
prop - 새로 정의하거나 수정하려는 속성의 이름 또는 [Symbol]
descriptor - 새로 정의하거나 수정하려는 속성을 기술하는 객체.

속성 서술자(descriptor)는 데이터 서술자(data descriptors)와 접근자 서술자(accessor descriptors) 두 가지 형식을 취할 수 있습니다.

데이터 서술자는 값을 가지는 속성을 기술할 때 사용합니다.

configurable속성의 값을 변경할 수 있고, 객체에서 삭제할 수도 있으면 true(기본 값은 false)

enumerable - 속성이 객체의 속성 열거 시 노출되면 true(기본 값은 false)

value - 속성에 연관된 값. 유효한 JavaScript 값(숫자, 객체, 함수 등)은 모두 사용할 수 있음(기본 값은 undefined)

writable - 할당연산자로 속성의 값을 바꿀 수 있으면 true(기본 값은 false)


접근자 서술자

는 접근자(getter)-설정자(setter) 함수를 한 쌍으로 가지는 속성을 기술할 때 사용

get - 속성의 접근자로 사용할 함수. 접근자가 없으면 [undefined] 이 속성에 접근하면, 접근할 때 사용한 객체(속성의 주인 객체와 다를 수 있음)를 이 함수의 this로 설정하고, 매개변수 없이 호출한 뒤 그 반환 값을 이 속성의 값으로 취급(기본 값은 undefined)

set - 속성의 설정자로 사용할 함수입니다. 설정자가 없으면 undefined 이다.`

이 속성에 값을 할당하면, 할당할 때 사용한 객체를 이 함수의 this로 설정하고, 한 개의 매개변수(할당 중인 값)로 호출. (기본 값은 undefined)


ex)

let obj ={}

Object.defineProperty(obj, 'name' ,{})

obj.name //undefined → value의 기본 값은 undefined

delete obj.name  // false → configurable의 기본값은 false이기 때문에 

Object.keys(obj) // [] → enumerable의 기본 값은 false이기 때문에 열거 안됨

obj.name = 'killdong' → writable의 기본값은 false이기 때문에 값이 안바뀐다

obj.name // undefined


Object.defineProperty(obj, 'name' ,{
enumerable: true,
configurable: true,
writable: true,
value: 'kill-dong'
})

obj.name // ‘kill-dong’

Object.keys(obj) // [’name’] → enumerable true이기 때문에 열거 가능

obj.name = 'hong kill-dong' //  writable true이기 때문에 값이 바뀐다

delete obj.name  // true

obj.name  // undefined


const obj = {}

Object.defineProperty(obj, 'name', {
get: function(){
console.log('get function', this._name);
},
set : function(value){
console.log('set function', value);
this._name = value;
}

})

obj.name='kill-dong' //set function kill-dong
obj.name // get function kill-dong

출처

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

반응형