[JS] 객체의 [[Prototype]]과 __proto__ (정리중)

[[Prototype]]

- 객체는 [[Prototype]]이라는 숨김 프로퍼티를 갖고 있다.

- 이 숨김 프로퍼티 값은 null이거나 다른 객체에 대한 참조가되는데, 다른 객체를 참조하는 경우 참조 대상을

  'prototype'이라 부른다.

- [[Prototype]]은 값을 직접적으로 설정할 수 없다. 값을 설정하려면 __proto__를 사용해야 한다.

- [[Prototype]]은 프로퍼티를 읽을 때만 사용한다. (프로퍼티 추가, 수정, 삭제는 해다아 객체에 직접 해야 한다.)

---

프로토타입 상속(prototypal inheritance)

object에서 프로퍼티를 읽을 때 해당 프로퍼티가 없으면 자바스크립트는 자동으로 prototype에서 프로퍼티를 찾는다.

프로그래밍에선 이런 동작 방식을 '프로토타입 상속’이라 부른다.

---

__proto__

- proto link라고도 불린다.

- __proto__는 [[Prototype]]의 getter(획득자)이자 setter(설정자)이다.

- 하위 호환성 때문에 여전히 __proto__를 사용할 순 있지만, 비교적 근래에 작성된 스크립트에선 __proto__ 대신 함수 

  Object.getPrototypeOf나 Object.setPrototypeOf을 써서 프로토타입을 획득(get)하거나 설정(set)한다.

Object.getPrototypeOf

Object.getPrototypeOf(obj)

Object.setPrototypeOf

Object.setPrototypeOf(obj, prototype);

---

prototype 체이닝의 3가지 제약사항

1. 순환 참조(circular reference)는 허용되지 않는다.
2. __proto__의 값은 객체나 null만 가능하다. (다른 자료형은 무시)
3. 객체엔 오직 하나의 [[Portotype]]만 있을 수 있다.

프로토타입의 참조는 쌍방통행이 아닌 일방통행이다.

[검증]

1. 순환 참조는 허용되지 않는다.

let user = {name : '열매'};
let guest = {id : 'fruit'};

//user [[Prototype]]에 연결된 객체를 guest로 설정
Object.setPrototypeOf(user, guest)

//연결됐는지 확인
user.id; //"fruit"

//guest [[Prototype]]에 연결된 객체를 user로 설정해 보자.
Object.setPrototypeOf(guest, user) //에러

2. __proto__의 값은 객체나 null만 가능하다. (다른 자료형은 무시)

let user = {name : '열매'};

Object.setPrototypeOf(user, null)
Object.setPrototypeOf(user, 3) //에러

3. 객체엔 오직 하나의 [[Portotype]]만 있을 수 있다. 

let user = {name : '열매'};
let info1 = {id : 'fruit'};
let info2 = {pw : 123};

Object.setPrototypeOf(user, info1);
Object.setPrototypeOf(user, info2);

---

[[Prototype]]에 연결된 프로퍼티는 읽을 때만 사용한다.

let a = {
  fun(){alert('a함수를 실행')}
};

let b = {
  __proto__: a
};

a; // a 프로퍼티 확인
b; // b 프로퍼티 확인

a객체와 b객체의 프로퍼티를 확인해보면, a객체에는 함수가 있고, b객체는 비어있다.

 

b.fun = function(){
  alert('b함수 실행');
}

b; // b 프로퍼티 확인

b객체에 함수가 생겼다.

 

b.fun(); // b함수 실행
a.fun(); // a함수를 실행

a객체의 fun함수가 수정된 것이 아니라, b객체에 fun함수가 추가된 것을 알 수 있다.

 

위의 코드를 통해서 알 수 있는 것은

[[Prototype]]에 연결된 프로퍼티는 읽을 때만 사용하고, 추가/수정/삭제는 해당 객체에 직접 해야 한다.

---

'this'가 나타내는 것

this는 프로토타입에 영향을 받지 않기 때문에 언제나 . 앞에 있는 객체가 된다.

---

반복문

let user = {
  name : 'mill',
  age : 15
}
let like = {
  book : 'Comic',
  music : 'Jass',
  __proto__ : user
}

Object.keys: 자신의 키만 반환한다.

for...in: 자신의 키와 상속 프로퍼티의 키 모두를 순회한다.

---

[공부 좌표]

프로토타입 상속

 

 

 

 

 

 

 

[참고]