JavaScript는 프로토타입 기반 언어이다. 즉 JavaScript는 객체를 상속하기 위하여 프로토타입이라는 방식을 이용한다.
모든 객체는 [[Prototype]] 이라는 내부 슬롯을 가지는데, 슬롯의 값은 프로토타입의 참조이다. 객체가 생성될 때, 객체 생성 방식에 따라 프로토타입이 결정되어 [[Prototype]] 에 저장되며, 모든 객체는 하나의 프로토타입을 갖고, 모든 프로토타입은 생성자 함수와 연결되어 있게 된다!
---여기서 말하는 프로토타입은 '원형객체'를 의미한다---
class Human {
constructor(name, age) {
this.name = name;
this.age = age;
}
sleep() {
console.log(`${this.name}은 잠에 들었습니다`);
}
}
let humanName = new Human('이름', 24);다음과 같은 코드가 있다고 가정해보자
Human.prototype.constructor === Human;
Human.prototype === humanName.__proto__;
Human.prototype.sleep === humanName.sleep;이 코드를 실행했을때 각각 어떠한 boolean 값이 나올까?
결론을 바로 이야기한다면 셋 모두 True가 나온다.
해당 그림을 보면 이해하기 쉬워진다. Human클래스의 생성자 함수는 Human이 되는 것이고, Human 클래스의 프로토타입은 Human 클래스의 인스턴스인 humanName의 __proto__이다. 마지막의 Human 클래스의 sleep메서드는 프로토타입에 있기 때문에, Human 클래스의 인스턴스인 humanName에서 humanName.sleep으로도 사용할 수 있기 때문에 True값을 반환한다.
참고로 __proto__ 는 접근자 프로퍼티인데, 모든 객체는 __proto__로 [[Prototype]] 내부 슬롯에 간접적으로 접근할 수 있다.
이외에도 흔히 자주 쓰이는 Array(배열)에서도 같은 적용해볼 수 있다. 배열이 Array클래스의 인스턴스라면, 프로토타입으로는 push, pop, slice 등의 메서드 존재한다고 볼 수 있기 때문이다! (신기)
