[JavaScript]Property Attribute

자바스크립트에서 객체의 프로퍼티를 크게 두 종류로 볼 수 있다.

1. 데이터 프로퍼티 - 키와 값이 있는 실질적인 데이터
2. 액세스 프로퍼티 - 자체적으로 값을 가지고 있지는 않으나 호출 시 값을 불러오거나 설정할 수 있다.

 

const person = {
	name: "홍길동"
    ,year: 2000
    
    get age() {
    	return new Date().getFullYear() - year;
    }
    
    set age(age) {
    	this.year = new Date().getFullYear() - age;
    }
}

여기서 데이터 프로퍼티는 name, year를 이야기하고 액세스 프로퍼티는 getter, setter를 의미한다.

우리가 변수처럼 사용하는 프로퍼티는 내부적으로 또 다른 속성들이 존재한다. 마치 프로퍼티도 객체처럼 속성을 가지고 있다.

 

// Object에 static 메서드인 getOwnPropertyDescriptor을 이용하면 프로퍼티의 속성을 볼수있다.
console.log(Object.getOwnPropertyDescriptor(person, "name"));

콘솔에 출력하면 다음과 같이 객체처럼 속성이 존재한다. 하나씩 살펴보자.

 

• value
  • 우리가 변수에 값을 저장했을 때 실제로 가지고 있는 값
• writable
  • 값을 수정할 수 있는지에 대한 여부
  • false가 되면 해당 value를 수정할수 없고 오직 읽기만 가능하다.
• enumerable
  • 열거가 가능한지 여부 (순회가 가능한지에 대한 여부)
  • 반복문에서 사용이 불가능하다.
• configurable
  • 이러한 설정을 재정의 가능하게 할 건지에 대한 여부

 

 

// 새롭게 프로퍼티를 추가할때 defineProperty를 써서 속성을 설정할수 있다.
Object.defineProperty(person, 'height', {
    value: 172,
    writable: true,
    enumerable: true,
    configurable: true,
});

// 기존에 해당 속성이 존재할시 선택한 속성만 변경 가능하다.
Object.defineProperty(person, 'name', {
    writable: false,
});