본문 바로가기
JavaScript

[PoiemaWeb] 프로토타입

by pds6370 2023. 3. 12.

프로토타입 기반 객체지향 프로그래밍 언어는 클래스 없이도 객체를 생성할 수 있다.

 

자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있다. 그리고 이것은 마치 객체 지향의 상속 개념과 같이 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게 한다.이러한 부모 객체를 Prototype 객체 또는 Prototype이라 한다.

Prototype 객체는 생성자 함수에 의해 생성된 각각의 객체에 공유 프로퍼티를 제공하기 위해 사용한다.

 

자바스크립트의 모든 객체는 [[Prototype]]이라는 인터널 슬롯을 가진다. [[Prototype]]의 값은 null 또는 객체이며 상속을 구현하는데 사용된다. [[Prototype]] 객체의 데이터 프로퍼티는 get 액세스를 위해 상속되어 자식 객체의 프로퍼티처럼 사용할 수 있다.  하지만 ser액세스는 허용되지 않는다.

 

[[Prototype]]의 값은 Prototype 객체이며 __proto__ accessor porperty로 접근할 수 있다. __proto__ 프로퍼티에 접근하면 내부적으로 Object.getPrototypeOf가 호출되어 프로토타입 객체를 반환한다.

 

 

1. [[Prototype]] vs prototype 프로퍼티

모든 객체는 자신의 프로토타입 객체를 가리키는 [[Prototype]] 인터널 슬롯을 가지며 상속을 위해 사용된다.

  • [[Prototype]] 
    함수를 포함한 모든 객체가 가지고 있는 인터널 슬롯이다.
    객체의 입장에서 자산의 부모 역할을 하는 프로토타입 객체를 가리키며 함수 객체의 경우 function.prototype를 가리킨다.
  • prototype 프로퍼티
    함수 객체만 가지고 있는 프로퍼티이다.
    함수 객체가 생성자로 사용될 때 이 함수를 통해 생성될 객체의 부모 역할을 하는 객체(프로토타입 객체)를 가리킨다.

2. constructor 프로퍼티

프로토타입 객체는 constructor 프로퍼티를 갖는다. 이 constructor 프로퍼티는 객체의 입장에서 자신을 생성한 객체를 가리킨다.

예를 들어 Person()생성자 함수에 의해 생성된 객체를 foo라 하자. 이 foo 객체를 생성한 객체는 Person() 생성자 함수이다.

이때 foo 객체 입장에서 자신을 생성한 객체는 Person()생성자 함수이며,  foo 객체의 프로토타입 객체는 Person.prototype이다. 따라서 프로토타입 객체 Person.prototype의 constructor 프로퍼티는 Person()생성자 함수를 가리킨다.

 

3. Prototype chain

자바스크립트는 특정 객체의 프로퍼티나 메소드에 접근하려고 할 때 해당 객체에 접근하려는 프토퍼티 또는 메소드가 없다면 [[Prototype]]이 가리키는 링크를 따라 자신의 부모 역할을 하는 프로토타입 객체의 프로퍼티나 메소드를 차례대로 검색한다. 이것을 프로토타입 체인이라 한다.