본문 바로가기
개발/JavaScript

자바스크립트 - 객체 속성 기술자 (Object Property Descriptor)

by 피로물든딸기 2021. 10. 4.
반응형

자바스크립트 전체 링크

 

자바스크립트의 모든 객체는 자기 자신에 대한 정보를 담은 속성 기술자(Property Descriptor)를 가지고 있다.

value 객체의 값
writable false라면 값 변경 불가
enumerable false라면 for in, Object.key 나열 불가
configurable false라면 속성 기술자 변경 불가

 

getOwnPropertyDescriptor를 통해 속성 기술자 객체를 확인해볼 수 있다.

let car = {
  name: "tesla",
  color: ["red", "blue", "green"],
};

console.log(Object.getOwnPropertyDescriptor(car, "name"));
console.log(Object.getOwnPropertyDescriptor(car, "color"));
console.log(Object.getOwnPropertyDescriptor(car, "nothing"));


definePropery 메서드로 객체의 속성을 정의할 수 있다.

let car = {
  name: "tesla",
  color: ["red", "blue", "green"],
};


Object.defineProperty(car, "name", {
    value: "tesla upgrade",
    /* enumberable: true, */ // default value는 true
    writable: false,
});

console.log(Object.getOwnPropertyDescriptor(car, "name"));
console.log(Object.getOwnPropertyDescriptor(car, "color"));
console.log(Object.getOwnPropertyDescriptor(car, "nothing"));

car.name = "hyundae";
console.log(car.name);

 

car의 속성 중 writable을 false로 만들고 car.name을 변경하였다.

writable이 false이기 때문에 name이 변경되지 않았다.


enumerable을 false로 할 경우, for in 루프로 접근이 불가능하다.

let car = {
  name: "tesla",
  color: ["red", "blue", "green"],
};

for (let key in car) {
  console.log(key);
}

console.log("enumerable false");
Object.defineProperty(car, "name", {
  value: "tesla upgrade",
  enumerable: false,
});

for (let key in car) {
  console.log(key);
}


마지막으로 configurable을 false로 만들어보자.

let car = {
  name: "tesla",
  color: ["red", "blue", "green"],
};

console.log(delete car.name); // true

console.log(car);
car.name = "new tesla";
console.log(car);

console.log("configurable false");
Object.defineProperty(car, "name", {
  value: "tesla upgrade",
  configurable: false,
});

console.log(delete car.name); // false
console.log(car);
car.name = "new new tesla";
console.log(car);

Object.defineProperty(car, "name", {
  configurable: true, // 재정의 불가
});

 

delete로 name을 지울 수 없는 것을 알 수 있다. 

실제 console로 delete car.name을 출력해보면, configurable이 false가 되고 나서 false를 리턴하는 것을 알 수 있다.

값을 변경하는 것은 상관없다. (new new tesla로 변경)

 

그리고 defineProperty로 다시 속성을 변경하면 에러가 발생한다.

반응형

댓글