Section 2 프로토타입과 클래스

프로토타입과 클래스

프로토타입

JavaScript는 프로토타입 기반 언어이다. 여기서 프로토타입은 원형 객체를 의미한다.

모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체를 가진다는 의미.

프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수 있고 그 상위 프로토타입 객체도 마찬가지다. 이를 프로토타입 체인(prototpye chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간이다.

JavaScript에서는 객체 인스턴스와 프로토타입 간에 연결(많은 브라우저들이 생성의 prototype 속성에서 파생된 proto 속성으로 객체 인스턴스에 구현하고 있습니다.)이 구성되며 이 연결을 따라 프로토타입 체인을 타고 올라가며 속성과 메소드를 탐색합니다.

참고: 객체의 prototype(Object.getPrototypeOf(obj)함수 또는 deprecated 된 proto속성으로 접근 가능한)과 생성자의 prototype 속성의 차이를 인지하는 것이 중요합니다. 전자는 개별 객체의 속성이며 후자는 생성자의 속성입니다. 이 말은 Object.getPrototypeOf(new Foobar())의 반환값이 Foobar.prototype과 동일한 객체라는 의미입니다.

출처 MDN

prototype 와 .__proto__

class Human {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sleep() {
    console.log(`${this.name}은 잠에 들었습니다`);
  }
}

let kimcoding = new Human('김코딩', 30);

Human.prototype.constructor === Human; // 결과는?
Human.prototype === kimcoding.__proto__; //결과는?
Human.prototype.sleep === kimcoding.sleep; //결과는?

위 코드를 참조하여

Human 클래스의 생성자 함수는 Human 이며 Human 클래스의 프로토타입은 Human클래스의 인스턴스인 kimcoding의 .__proto__ 이다.

프로토 타입은 상속받을 수 있는 값이라고 보면 될 것 같다.

부모의 객체를 자식의 프로토타입에 할당해주어야 한다.

클래스, 인스턴스, 프로토타입의 관계

저작권 문제로 첨부하지 못함.