프로퍼티 정의(object.defineProperty) 마스터 하기

Property 추가하거나 속성(Property Attribute)을 변경하는 방법은?

Object.defineProperty()은 JavaScript에서 객체의 프로퍼티를 정의 또는 수정하는 메서드입니다. 이 메서드를 사용하면 객체에 새로운 프로퍼티를 추가하거나 기존 프로퍼티의 속성을 변경할 수 있습니다.

프로퍼티랑 프로퍼티 속상 자세히 알아보기..!

---

defineProperty 인수

1. 첫번째 : 객체 참조
2. 두번쨰 : 프로퍼티
3. 세번째 : Object Descriptor 객체

const person = {};

Object.defineProperty(person, 'firstName', {
	value: 'Ungmo',
  	writable: true,
  	enumerable: true,
  	configurable: true
}

---

objectDescriptor 객체의 default 값

• value : undefined
• get : undefined
• set : undefined
• writable : false
• enumerable : false
• configurable : false

const person = {};

Object.defineProperty(person, 'lastName', {
	value: 'Lee'
}
// {value: 'Lee', writable: false, enumerable: false, configurable: false}                       

1. enumerable : false 인경우

for...in문이나 Object.keys로 열거할 수 없다.

const person = {};

Object.defineProperty(person, 'firstName', {
	value: 'Ungmo',
  	enumerable: true
};
                       
Object.defineProperty(person, 'lastName', {
	value: 'Lee'
};

//enumerable: true인 firstName만 열거됨
console.log(Object.keys(person)) // ["firstName"]

2. writable : false 인경우

해당 프로퍼티의 값을 변경할 수 없다.

에러는 발생하지 않고 무시된다.

const person = {};

Object.defineProperty(person, 'firstName', {
	value: 'Ungmo',
  	enumerable: true,
  	writable: true
};
                       
Object.defineProperty(person, 'lastName', {
	value: 'Lee'
};

//writable: true인 firstName만 변경하면 적용됨
person.firstName = 'Boyeon';
person.lastName = 'Kim';

console.log(person.firstName); //Boyeon
console.log(person.lastName); //Lee

3. configurable : false 인경우

3-1. 삭제할 수 없다.

에러는 발생하지 않고 무시된다.

const person = {};

Object.defineProperty(person, 'firstName', {
	value: 'Ungmo',
  	enumerable: true,
  	writable: true,
  	configurable: true
});
                       
Object.defineProperty(person, 'lastName', {
	value: 'Lee'
});

//configurable: true인 firstName만 삭제하면 적용됨
delete person.firstName;
delete person.lastName;

console.log(person.firstName); //undefined
console.log(person.lastName); //Lee

3-2. 재정의할 수 없다.

TypeError: Cannot redefine property : ~

const person = {};

Object.defineProperty(person, 'firstName', {
	value: 'Ungmo',
  	enumerable: true,
  	writable: true,
  	configurable: true
});
                       
Object.defineProperty(person, 'lastName', {
	value: 'Lee'
});

person.firstName = 'Boyeon';
// TypeError: Cannot redefine property : lastName
person.lastName = 'Jin';

---

definePropertys 인수

defineProperty는 하나의 프로퍼티만 정의할 수 있지만, definePropertys 매소드를 사용하면 여러개의 프로퍼티를 정의할수 있습니다.

const obj = {};

Object.defineProperties(obj, {
  name: {
    value: "John",
    writable: true
  },
  age: {
    value: 30,
    writable: false
  },
  city: {
    value: "New York",
    writable: true
  }
});

console.log(obj.name); // "John"
console.log(obj.age); // 30
console.log(obj.city); // "New York"

---