이력

  • 2021.11.23 포스팅
  • 2021.11.26 사소한 수정

모든 내용을 상세히 담으려 하지 않았습니다.
제가 모르는 부분이나, “이런 것도 있었어?” 하는 부분, 중요하다고 생각되는 부분,
다시 한번 되새기고 싶은 부분만 기록했습니다.
읽어주셔서 감사합니다.

20.1 프로퍼티 리스트

  • ES5 스펙에서 Obejct에 함수와 디스크립터들을 추가했다.
  • 추가된 메소드는 없다.(메소드는 인스턴스에서 사용가능한 Function을 의미함) ​

20.2 오브젝트에 프로퍼티 추가, Object.defineProperty()

  • ES3에서 오브젝트에 프로퍼티를 추갈하려면 아래와 같았다.
1
2
var obj = {};
obj.add = '더하기'
  • ES5는 제약이 있어 프로퍼티를 무작정 변경할 수 없다. 프로퍼티마다 상태값을 갖고 있다.
1
2
3
4
var obj = {};
Object.defineProperty(obj, "book", {
  value : 123
});
  • (위의 코드 설명) value는 약속된 이름으로 다른 이름을 사용할 수 없으며 속성이라고 부른다. book 프로퍼티가 변경 허용 상태일 때만 변경할 수 있으며 변경 불가 상태이면 변경할 수 없다.

20.3 오브젝트 프로퍼티 열거 불가

1
2
3
4
5
6
7
8
9
var obj = {};
Object.defineProperty(obj, "soccer", {
  value: "11명",
  enumerable: true,  //  속성의 값에 따라 프로퍼티의 열거가능 유무가 정해진다.
});

for (var name in obj) {
  js.log(name + ' : ' + obj[name]);
}
  • 프로퍼티의 속성 이름 및 디폴트 값
속성 이름디폴트 값
[[Value]]undefined
[[Get]]undefined
[[Set]]undefined
[[Writable]]false
[[Enumerable]]false
[[Configurable]]false
  • [[xxxxx]]는 내부 처리용 이름이며 xxx 는 소스 코드에 작성하는 이름이다.

20.4 ES5 Object 개요

  • ES3 Object로 객체 지향 프로그램을 구현할때 부족했던 점을 보강했다.
  • 함수들이 많이 추가되었는데, 함수를 추가했다는 것은 인스턴스를 생성하지 않고 바로 호출할 수 있다는 것을 의미한다. 인스턴스를 만든다는 것은 개별적인 데이터를 가지기 위함이기 때문에 값에 집중하는 것이다. 함수(인스턴스 없이 사용가능)를 추가했다는 것은 값에 비중을 두지 않고 공통 사용에 집중한다는 것이다. 공통으로 사용하기 위해서는 공통 환경을 지원할 수 있어야 한다. 데이터만 맞춰주면 동일한 함수를 통해서 처리될 수 있어야 한다. 이 개념의 구현이 파라미터에 처리 대상 오브젝트를 지정하여 데이터를 처리하는 함수로 구현된 것이다.

20.5 프로퍼티 디스크립터 타입

  • enumerable과 같은 속성을 프로퍼티 디스크립터 타입이라고 한다.
  • 프로퍼티 디스크립터 타입은 필드 이름과 필드 값으로 구성되며 이를 레코드라고 한다. enumerable : true 의 경우, enumerable은 필드 이름, true 필드 값, enumerable: true 가 레코드가 된다.
  • 레코드는 필드 중심의 표기이고 속성은 프로퍼티 중심의 표기이다.
  • 프로퍼티 디스크립터 타입은 데이터 프로퍼티와 액세스 프로퍼티로 분류된다.
  • 데이터 프로퍼티 디스크립터
필드 이름필드 값 형태디폴트 값개요
value자바스크립트 지원 데이터 타입undefined프로퍼티 값으로 사용
writabletrue, falsefalsefalse: 필드 값 변경 불가
enumerabletrue, falsefalsefalse: for-in 열거 불가
configuragletrue, falsefalsefalse: 프로퍼티 삭제 불가

o 액세스 프로퍼티 디스크립터

필드 이름필드 값 형태디폴트 값개요
getFunction Object, undefinedundefined프로퍼티 함수
setFunction Object, undefinedundefined프로퍼티 함수
enumerabletrue, falsefalsefalse: for-in 열거 불가
configurabletrue, falsefalsefalse: 프로퍼티 삭제 불가
  • 데이터 프로퍼티 디스크립터와 액세스 프로퍼티 디스크립터중에 하나만 사용가능하다.
  • value, writable 의 유무를 판단해 존재하면 데이터 프로퍼티 디스크립터 아니면 액세스 프로퍼티 디스크립터로 인식한다. 모순되는 필드는 동시에 작성하면 에러가 발생한다.

20.6 get 속성

1
2
3
4
5
6
7
8
var obj = {};
Object.defineProperty(obj, 'book', {
  get: function() {
    return "테스트";
  }
});
result = obj.book;
js.log(result);
  • 자바스크립티 엔진이 obj.book 문장을 만나면 book 프로퍼티 값을 반환하지 않고, obj.book 프로퍼티의 get 함수를 호출한다. 이것이 get 함수의 특징이다.
  • obj.book.get() 형태로 호출하면 에러가 발생한다. obj.book 에서 우선 “테스트"를 리턴하기 때문이다.

20.7 set 속성

  • get과 동일하다.

20.8 프로퍼티 디스크립터 반환, getOwnPropertyDescriptor()

  • 프로퍼티의 디스크립터에 속한 필드를 반환한다. ​

20.9 다수의 프로퍼티 추가, 변경, defineProperties()

  • defineProperty() 함수와 기능이 같다. 다수의 프로퍼티 속성을 작성할 수 있다.

20.10 프로퍼티 이름 반환, getOwnPropertyNames()

  • 지정한 오브젝트의 모든 프로퍼티 이름을 배열로 반환한다. 속성의 열거 가능 여부는 체크하지 않는다.
  • own 프로퍼티: 자신이 만든 프로퍼티를 의미한다. 자신의 만들지 않은 프로퍼티는 제한하여 데이터를 보호하기 용기하다.

20.11 열거 가능 프로퍼티 이름 반환, keys()

20.12 prototpye에 연결된 프로퍼티 반환, getPrototypeOf()

20.13 프로퍼티 추가 금지 설정, preventExtensions()

  • 추가는 안되지만 변경, 삭제는 가능하다.
  • 추가 금지를 설정하면 추가 가능으로 바꿀 수 없다.

20.14 프로퍼티 추가 금지 여부, isExtensible()

20.15 프로퍼티 추가, 삭제 금지 설정, seal()

  • 모든 프로퍼티의 configurable을 false로 설정한다.

20.16 프로퍼티 추가, 삭제 금지 여부, isSealed()

20.17 프로퍼티 추가, 삭제, 변경 금지 설정, freeze()

  • 모든 프로퍼티에 대핸 configurable: false, writable: false 로 설정

20.18 프로퍼티 추가, 삭제, 변경 금지 여부, isFrozen()