[ 모던 자바스크립트 스터디 ] 왜 __proto__ 접근자 프로퍼티를 통해 접근하는가?

[[Prototype]] 내부 슬롯의 값, 즉 프로토타입에 접근하기 위해 접근자 프로퍼티를 사용하는 이유는

상호 참조에 의해 프로토타입 체인이 생성되는 것을 방지하기 위해서다.

 

const parent = {};
const child = {};

child.__proto__ = parent;
parent.__proto__ = child; // TypeError: Cyclic __proto__ value

 

 

프로토타입 체인은 단방향 링크드 리스트로 구현이 되어야한다.

따라서 순환 참조하는 프로토타입 체인이 만들어지면 프로토타입 체인의 종점이 없기 때문에

프로퍼티를 검색할 때 무한 루프에 빠질 수 있다.

 

따라서 체크 없이 무조건적으로 프로토타입을 교체할 수 없게끔

__proto__ 접근자 프로퍼티를 통해 프로토타입에 접근해 교체하도록 구현되어 있는 것이다.

 

 

사실 모던자바스크립트 딥다이브 책에서도 __proto__ 접근자 프로퍼티를 코드 내에서 직접 사용하지 말라 권고한다.

 

 

 

 

함수 객체 prototype 프로퍼티

 

함수 객체만 갖고 있는 prototype 프로퍼티는 함수가 생성할 인스턴스의 프로토타입을 가리킨다.

 

(function () {}).hasOwnProperty('prototype'); // true

({}.hasOwnProperty('prototype'); //false

 

 

prototype 프로퍼티는 생성자 함수가 생성할 인스턴스의 프로토타입을 가리켜서,

화살표함수는 prototype 프로퍼티를 소유하지도 않고, 프로토타입도 생성하지 않는다.

 

 

모든 객체가 가지고 있는 __proto__ 접근자 프로퍼티와

함수 객체만 가지고 있는 prototype 프로퍼티는 결국 동일한 프로토타입을 가리킨다.

 

하지만 이 둘은 프로퍼티를 사용하는 주체가 다르다는 걸 알고 있어야한다.

 

 

구분	소유	값	사용 주체	사용 목적
__proto__ 접근자 프로퍼티	모든 객체	프로토타입의 참조	모든 객체	객체가 자신의 프로토타입에 접근 또는 교체하기 위해 사용
prototype 프로퍼티	constructor	프로토타입의 참조	생성자 함수	생성자 함수가 자신이 생성할 객체의 프로토타입을 할당하기 위해 사용

 

 

function Person(name) {
	this.name = name;
}

const me = new Person('Hong');

console.log(Person.prototype == me.__proto__); // true

 

 

Person 함수의 prototype 은 결국 해당 함수의 객체(인스턴스) 가 갖는 __proto__ 와 동일한 프로토타입을 가리킨다.