프로토타입을 상속해서 만들어지는 객체들관의 연관관계
프로토타입 체인의 매커니즘은 다음과 같다.
- 객체에서 속성 또는 메서드를 찾습니다.
- 해당 객체에서 속성 또는 메서드를 찾지 못한 경우, 객체의 프로토타입으로 이동합니다.
- 프로토타입에서 속성 또는 메서드를 찾습니다.
- 프로토타입에서 속성 또는 메서드를 찾지 못한 경우, 프로토타입의 프로토타입으로 이동합니다.
- 이러한 과정을 반복하여 프로토타입 체인 상위의 프로토타입까지 계속 탐색합니다.
- 최종적으로 속성이나 메서드를 찾으면 반환하고, 찾지 못한 경우 undefined를 반환합니다.
// 부모 클래스: Animal
class Animal {
constructor(name) {
this.name = name;
}
eat() {
console.log(`${this.name} is eating.`);
}
}
// 자식 클래스: Cat
class Cat extends Animal {
meow() {
console.log(`${this.name} says meow.`);
}
}
// 인스턴스: lion
let lion = new Cat('Simba');
console.log(lion.__proto__ === Cat.prototype); // true
console.log(Cat.prototype.__proto__ === Animal.prototype); // true
console.log(Animal.prototype.__proto__ === Object.prototype); // true
또 하나 알아야 할것은 바로 Object.prototype이다.
모든 프로토타입 체이닝의 종점으로 Object는 가장 상위 객체이다.(모든 클래스의 조상)
그러면 object.prototype을 사용해서 예시를 확인해보자
// 부모 클래스: Animal
class Animal {
constructor(name) {
this.name = name;
}
eat() {
console.log(`${this.name} is eating.`);
}
}
// 자식 클래스: Cat
class Cat extends Animal {
meow() {
console.log(`${this.name} says meow.`);
}
}
// 인스턴스: lion
let lion = new Cat('Simba');
console.log(lion.__proto__ === Cat.prototype); // true
console.log(Cat.prototype.__proto__ === Animal.prototype); // true
console.log(Animal.prototype.__proto__ === Object.prototype); // true
console.log(Object.prototype.__proto__); // null
예시를 보면 알겠지만
Object.prototype.__proto__
는 null을 가리키는데, 이는 프로토타입 체인의 끝을 나타낸다.
Why? object는 최상위의 프로토타입이기 때문에 null은 프로토타입 체인의 종점으로서 더 이상의 상위 프로토타입이 없음을 의미하기 때문이다.