JavaScript는 프로토타입 기반 언어입니다. 객체의 프로퍼티를 찾을 때 프로토타입 체인을 따라 탐색합니다.
모든 JavaScript 객체는 [[Prototype]]이라는 내부 슬롯을 통해 다른 객체를 참조합니다. 객체에서 프로퍼티를 찾지 못하면, __proto__를 따라 상위 프로토타입에서 탐색을 계속합니다. 이 체인은 Object.prototype을 거쳐 null에서 끝납니다. ES6의 class 문법도 내부적으로 이 프로토타입 체인 위에서 동작합니다.
객체를 선택하고 프로퍼티를 입력하면, 체인을 따라 탐색하는 과정을 확인할 수 있습니다.
실제 코드로 동작 원리를 확인하세요.
const animal = {
eats: true,
walk() {
console.log("걷는 중...");
}
};
const rabbit = {
jumps: true,
__proto__: animal // rabbit의 프로토타입을 animal로 설정
};
rabbit.walk(); // "걷는 중..." — animal에서 상속
rabbit.jumps; // true — 자신의 프로퍼티
rabbit.eats; // true — 프로토타입 체인을 통해 접근
// hasOwnProperty로 자체 프로퍼티 확인
rabbit.hasOwnProperty('jumps'); // true
rabbit.hasOwnProperty('eats'); // false (상속됨)__proto__가 가리키는 프로토타입 객체에서 탐색을 계속합니다. 이 과정은 프로토타입이 null일 때까지 반복되며, 이 연결된 탐색 경로를 프로토타입 체인이라 합니다. 모든 객체는 최종적으로 Object.prototype을 거쳐 null에 도달합니다.prototype은 함수 객체만 가지는 프로퍼티로, 해당 함수를 생성자로 사용할 때 새 인스턴스의 프로토타입이 될 객체를 가리킵니다.__proto__는 모든 객체가 가지는 내부 슬롯 [[Prototype]]의 접근자로, 실제 프로토타입 체인의 연결을 나타냅니다. 즉, new Foo()로 생성된 인스턴스의 __proto__는 Foo.prototype을 가리킵니다. 현대 코드에서는 Object.getPrototypeOf()를 사용하는 것이 권장됩니다.class는 프로토타입 기반 상속의 문법적 설탕(Syntactic Sugar)입니다.class Dog extends Animal은 내부적으로 Dog.prototype.__proto__ = Animal.prototype을 설정합니다. 메서드는 자동으로 prototype 객체에 추가되며,super()는 Animal.call(this)와 유사하게 동작합니다.class가 새로운 상속 모델을 도입한 것이 아니라, 기존 프로토타입 메커니즘을 더 읽기 쉽게 표현한 것입니다.