모던 자바스크립트 Deep Dive 정리 프로퍼티 어트리뷰트(16.1~데이터프로퍼티까지) 부분

김민찬·2022년 6월 20일
0

DeepDive

목록 보기
6/6

내부 슬롯과 내부 메서드

프로퍼티 어트리뷰트를 이해하기 위해 먼저 내부 슬롯과 내부 메서드의 개념을 알아보자.

자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드를 말한다.(의사👨‍⚕️?... pseudo를 찾아보니, 가짜라는 뜻이다.)

근데 내부 슬롯과 내부 메서드가 아직 뭔지 알기 어려웠다. 그래서 내용을 더 찾아봤는데

(더 알기 어렵다)

...아무튼! ECMAScript 사양에 등장하는 이중 대괄호[[]]로 감싼 이름들이 바로 내부 슬롯과 내부 메서드이다.

그 다음 내용은 저 위의 내용을 함축적으로 서술하고 있는데, 내부 슬롯과 내부 메서드는

  1. ECMAScript 사양에 의해 구현되어 있고 자바 스크립트 엔진에서 동작한다.

  2. 엔진의 내부 로직이므로 개발자가 직접 접근하거나 호출하도록 공개된 프로퍼티가 아니다.

  3. 단, 일부에 한해서 간접적으로 접근할 수는 있다.

EX) [[prototype]]이라는 내부 슬롯은 proto를 통해 간접적으로 접근 할 수 있다.

프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체

자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의한다. 프로퍼티 어트리뷰트는 자바 스크립트 엔진이 관리하는 내부 상태 값인 내부 슬롯 Value, Writable, Enumerable, Configurable이다.

위 네 가지는 직접 접근할 수 없지만 Object.getOwnPropertyDescriptor 메서드를 사용하여 간접적으로 확인할 수는 있다.

const person = {
name : 'lee'
};

person.age = 20;

console.log(Object.getOwnPropertyDescriptor(person, 'name'));
//프로퍼티 어트리뷰트 정보를 제공하는 프로퍼티 디스크립터 객체를 반환

console.log(Object.getOwnPropertyDescriptors(person));
//모든 프로퍼티의 프로퍼티 어트리뷰트 정보를 제공하는 프로퍼티 디스크립터 객체들을 반환한다.

데이터 프로퍼티와 접근자 프로퍼티

데이터 프로퍼티

프로퍼티는 데이터/접근자로 구분할 수 있다.

데이터 프로퍼티는 위에서도 말했듯 프로퍼티를 생성할 때 기본값으로 자동 정의된다.

프로퍼티가 생성될 때 [[Value]]의 값은 프로퍼티 값으로 초기화되고, 나머지는 true로 초기화된다.

profile
프론트엔드 개발자로 나아가고 있는 김민찬입니다.

0개의 댓글