🐸 [JavaScript] property attribute

다시 property로 돌아가자.

JavaScript 엔진은, property attribute 를 자동 정의한다.
(property arrtibute : property의 상태)

property attribute는 JavaScript 엔진이 관리하는 internal slot이다.

internal slot & internal method 내부 슬롯과 내부 메서드

internal slot과 internal method는, JavaScript의 구현 알고리즘을 설명하기 위한 것이다.
직접적인 접근은 불가능하지만, Object.getOwnPropertyDescriptor 메서드로 일부 간접 접근이 가능하다.

이러한 메서드를 호출하면,
첫 매개변수에는 객체의 참조를 반환하고,
두번째 매개변수에는 property key를 문자열로 전달한다.

그리고 메서드는, property arribute 정보를 제공하는 Property Descriptor 객체를 반환한다.

이 property 라는 건, 두가지로 나누어볼 수 있다.

data property & accessor property 데이터 프로퍼티와 접근자 프로퍼티

우리가 알고 있는 property는,
즉 key와 value로 구성되는 property는, data property 에 해당한다.

[[Value]] [[Writable]] [[Enumerable]] [[Configurable]] 이 data property arribute이다.


반면, 자체적인 값을 갖지 않고,
다른 data property의 값을 읽거나 저장할 때에 호출되는 accessor function으로 구성된 property를 accessor property 라고 한다.
이 함수는 getter/setter 함수라고도 부른다.

[[Get]] [[Set]] [[Enumerable]] [[Configurable]] 이 accessor property attribute이다.


이 둘은 어떻게 구별할 수 있을까?

data property vs. accessor property

accessor property의 경우 ~~를 반환하고, data property의 경우 ~~를 반환한다.

// 함수 객체의 prototpye은 data property이다.
Object.getOwnPropertyDescriptor(function() {}, 'prototype');
//-> {value: {...}, writable: true, enumerable: false, configurable: false}


// 일반 객체의 __proto__는 accessor property이다.
Object.getOwnPropertyDescriptor(Object.prototpye, '__proto__');

//-> {get: f, set: f, enumerable: false, configurable: true}

---

프로퍼티 정의

새 property를 추가하면서,
property attribute를 새로 정의하거나 기존의 property attribute를 재정의하는 것을 말한다!

---

객체 변경 방지

객체는 변경이 가능한 값이라고 했다. (재할당이 필요하지 않다)
property 추가, 삭제, 값 갱신, attribute 재정의가 가능하다.

Object.preventExtensions 객체 확장 금지

객체 확장을 금지하는 메서드이다.

property의 추가를 금지한다는 것이다.

property를 추가하는 방법으로는
Object.defineProperty 로 추가하는 방법
또는 Property 동적추가를 하는 방법이 있는데, 두 가지 모두를 금지한다.

Object.isExtensible 로 확장 여부를 확인할 수 있다.

Object.seal 객체 밀봉

객체를 밀봉하는 메서드이다.
property를 추가하거나 삭제, attribute를 재정의하는 것을 금지한다.

그러니까 읽기와 쓰기만 가능하다는 것이다.

Object.isSealed 로 밀봉 여부를 확인할 수 있다.

Object.freeze 객체 동결

객체를 동결하는 메서드이다.

property 추가, 삭제, 값 갱신, attribute 재정의가 금지된다.

오직 읽기만 가능한 것이다.

Object.isFrozen 으로 동결 여부를 확인할 수 있다.

불변 객체

여기까지의 메서드들은, 얕은 변경만을 방지하는 메서드였다.
그러니까 직속 property만 변경을 방지하며, 중첩된 객체에 대해서는 영향을 미치지 못한다.

중첩객체까지 동결해서, 완전히 변경 불가한 읽기 전용의 불변객체를 구현하려면 ?

모든 property에 재귀적으로 Object.freeze 메서드를 호출해주면 된다.

---

변수의 생명 주기까지 재밌게 공부를 하고 있었는데, 갑자기 property..?로 흐름이 바뀌어서 흥미가 살짝 떨어진 상태이다.

그래도 '그래 얼마나 중요하면 흐름을 깨고 개념을 넣었겠어'하는 생각에 나름 이해한 흐름으로 정리를 해보았다.