모던 자바스크립트 Deep Dive - 16장

박상은·2021년 9월 30일
0

정리

1. 내부슬롯과 내부메서드

자바스크립트 엔진에서 실제로 동작하지만 개발자가 직접 접근할 수 없도록 만들어둔 슬롯 or 메서드
하지만 몇몇슬롯과 메서드는 간접적으로 접근할 수 있는 수단을 제공하기도 한다
대부분 [[Prototype]]처럼 이중 대괄호로 감싸져있다.

  • [[Prototype]]__proto__

2. 프로퍼티 어트리뷰트

자바스크립트는 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 자동생성함

  • 프로퍼티어트리뷰트는 6가지 내부슬롯중 몇 가지를 가진다.
    1. [[Value]] : 프로퍼티값
    2. [[Writable]] : 변경가능여부 ( 기본값: true )
    3. [[Enumerable]] : 반복가능여부 ( 기본값: true )
    4. [[Configurable]] : 프로퍼티어트리뷰트를 수정가능여부 ( 기본값: true )
    5. [[Get]] : 접근자 프로퍼티로 값을 읽을 때 호출될 함수
    6. [[Set]] : 접근자 프로퍼티로 값을 저장할 때 호출될 함수

  • Object.getOwnPropertyDescriptor(객체참조, 프로퍼티키의 문자열) : 프로퍼티 어트리뷰트값 출력

2.1 데이터 프로퍼티

[[Value]], [[Writable]], [[Enumerable]], [[Configurable]]의 내부슬롯을 가짐

const person = { name: "john" };

console.log(Object.getOwnPropertyDescriptor(person, "name"));
// { value: "john", writable: true, enumerable: true, configurable: true }

2.2 접근자 프로퍼티

[[Get]], [[Set]], [[Writable]], [[Enumerable]], [[Configurable]]의 내부슬롯을 가짐

const person = {
  first: "full",
  last: "name",
  get name(){
    return this.first + this.last;
  },
  set name(fullname){
    [this.first, this.last] = fullname.split(" ");
  },
};
// { get: f name(), set: f name(fullname), writable: true, enumerable: true, configurable: true }

2.3 프로퍼티 정의

Object.defineProperty()를 이용해서 프로퍼티를 정의할 수 있다.

const person = {};

Object.defineProperty(person, "name", {
  // 미정의시 기본값 undefined
  value: "john",
  // 아래 3개는 미정의시 기본값 false
  writable: true,
  enumerable: false,
  configurable: true,
});

Object.defineProperty(person, "age", {
  value: "23",
  // 남은 3가지 기본값
});

Object.defineProperty(person, "address", {
  get(){
    // ...
  },
  set(address){
    // ...
  }
  writable: true,
  // 남은 2가지 기본값
});

person.age = 33;	// 무시됨
delete person.age;	// 무시됨
Object.keys(person);	// ["name", "address"]... age는 제외됨

3. 객체 변경 방지

구분메서드프로퍼티 추가프로퍼티 삭제프로퍼티 값 읽기프로퍼티 값 쓰기프로퍼티 어트리뷰트 재정의확인
객체 확장 금지Object.preventExtensionsXOOOOObject.isExtensible()
객체 밀봉Object.sealXXOOXObject.isSealed()
객체 동결Object.freezeXXOXXObject.isFrozen()

0개의 댓글