프로퍼티 어트리뷰트

Jun Hyoung Park·2022년 7월 13일
0

내부 슬롯과 메서드

  • 자바스크립트 엔진의 구현 알고리즘을 설며하기 위한 의사 프로퍼티, 의사 메서드

  • 형태

    • [[~~]] 감싼 이름들이 내부 슬롯과 내부 메서드
  • 자바스크립트 엔진 내부 로직이기 때문에 직접적인 접근과 호출 방법은 제공 하지않고 간접적인 접근만을 허용한다

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

프로퍼티 어트리뷰트

  • 프로퍼티를 생성할 때 프로퍼티 상태를 나타냄
  • 프로퍼티 상태: 값:[[value]], 값의갱신여부:[[writable]], 열거가능여부:[[enumerable]], 재정의 가능 여부:[[configurable]]

간접적인 참조

  • Object.getOwnPropertyDescripter(객체의참조, 프로퍼티키) 메서드
  • 프로퍼티 디스크립터 객체 반환: 프로퍼티 어트리뷰트 정보 제공, 정의되지 않았다면 undefined 반환
  • Object.getOwnPropertyDescripters 메서드는 모든 프로퍼티의 프로퍼티 어트리뷰트 정보를 제공

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

  • 데이터 프로퍼티: 키와 값으로 구성된 일반적인 프로퍼티
  • 접근자 프로퍼티: 다른 데이터 프로퍼티의 값을 읽거나 저장할 때 호출

데이터 프로퍼티

  • 프로퍼티 어트리뷰트
[[value]] value: 프로퍼티 키를 통해 값에 접근하면 반환되는
				 변경하면 [[value]] 재할당
                 없으면 동적 생성하고 [[value]]에 값 저장
[[writable]] writable: 값의 변경 가능 여부(불리언값), false일 경우 읽기전용 프로퍼티
[[enumerable]] enumerable: 열거 가능 여부(불리언값), false 열거 불가능
[[configurable]] configurable: 재정의 가능 여부(불리언값), false 삭제, 프로퍼티 어트리뷰트 값 변경 불가 
						[[writable]]이 true이면 [[value]]의 변경과 [[writable]]을 false로 변경 허용

접근자 프로퍼티

[[get]], get: 값을 읽을 때 호출되는 접근자 함수 
			  getter함수 호출 -> 프로퍼티 값 반환
[[set]], set: 값의 저장 호출 접근자 함수
			  setter함수 호출 -> 프로퍼티 값 저장
[[enumerable]] enumerable
[[configurable]] configurable  동일
const person = {
  firstName: 'Ungmo',
  lastName: 'lee',
  
// get동작
// 프로퍼티 키의 유효성 체크
// 프로토타입 테입에서 프로퍼티 검색
// 데이터, 접근자 프로퍼티인지 확인
// getter 함수를 호출하고 그 값 반환 
  get fullName(){
  	return `${this.firstName} ${this.lastName}';
  },
  set fullName(){
     [this.firstName, this.lastName] = name.split(' ');
  }
};

프로퍼티 정의

  • 새로운 프로퍼티를 추가 하면서 프로퍼티 어트리뷰트를 명시적 정의, 기존 프로퍼티 어트리뷰트 재정의
Object.defineProperty(객체의 참조, 프로퍼티키, 디스크립터 객체(프로퍼티 어트리뷰트 값))
Object.defineProperties: 여러 개 정의

//프로퍼티 디스크립터 객채의 기본 값
undefined(value, get, set)
false(writable, enumerable, configurable)

객체 변경 방지

  • 확장금지
    • 프로퍼티 추가 금지
    • Object.preventExtensions 메서드
    • Object.isExtensible 메서드로 확인
  • 객체밀봉
    • 프로퍼티 추가 및 삭제와 재정의 금지, 읽기 쓰기만 가능
    • Object.seal 메서드
    • Object.isSealed 메서드로 확인
  • 객체동결
    • 추가및 삭제와 재정의 금지, 읽기만 가능
    • Object.freeze 메서드
    • Object.isFrozen 메서드로 확인
  • 불변객체
    • 위의 것들은 얕은 변경방지로 중첩 객체에 영향을 주지 않는다
    • 재귀적으로 해야 전체적으로 가능하다
profile
프론트엔드 지망생

0개의 댓글