프로토타입 체인

프로토타입 체인 ⛓️

객체 지향 프로그래밍에서 객체 간 상속 관계를 구현하는 방식 중 하나이다. 이 방식은 객체에 대한 정보를 다른 객체로부터 상속받아 속성과 메서드를 확장하는 것을 가능하게 한다. 이러한 객체 간 상속 관계를 연결하는데 사용되는 것이 프로토타입 체인이다.

Prototype 🚙

모든 객체는 prototype 속성을 가지고 있습니다. 이 속성은 해당 객체를 생성한 생성자 함수의 prototype 객체를 가리키며, 해당 생성자 함수가 가지고 있는 속성과 메서드를 상속받을 수 있다.

.proto 👨‍👦

모든 객체는 proto 속성을 가지고 있습니다. 이 속성은 해당 객체의 부모 객체인 프로토타입 객체를 가리킨다. 따라서 객체가 가지고 있지 않은 속성이나 메서드를 호출할 때 해당 객체의 proto 속성을 통해 부모 객체에게서 상속받은 속성이나 메서드를 찾을 수 있다.

Object ⚙️

모든 객체의 조상인 기본 객체이다. Object 객체는 모든 객체가 상속받는 기본적인 속성과 메서드를 가지고 있다. 따라서 모든 객체는 Object 객체를 프로토타입 체인의 가장 아래에 두고, 해당 객체에서 사용할 속성과 메서드를 추가하거나 오버라이드하는 방식으로 객체를 구현한다.

프로토타입 체인을 이용하면 객체를 보다 쉽고 간편하게 구현할 수 있다. 생성자 함수를 이용해 객체를 생성하면 해당 생성자 함수의 prototype 객체와 proto 속성을 이용해 프로토타입 체인을 구성할 수 있다. 이를 통해 객체를 보다 효율적으로 구현하고 관리할 수 있다. 따라서 프로토타입 체인을 활용한 객체 지향 프로그래밍은 모던 자바스크립트에서 중요한 개념 중 하나이다.

예시 👨‍💻

예를 들어, 우리가 'Person'이라는 생성자 함수를 정의하고, 'kim'이라는 객체를 생성하려고 한다.

.js

function Person(name, age) {
  this.name = name;
  this.age = age;
}

let kim = new Person('Kim', 25);
위의 코드에서 'Person' 함수가 생성될 때, 'Person.prototype' 객체가 함께 생성된다. 'kim' 객체는 'Person' 함수를 통해 생성되었으므로, 'kim' 객체의 프로토타입 객체는 'Person.prototype' 객체가 된다.

.js

console.log(kim.__proto__ === Person.prototype); // true

따라서, 'kim' 객체에서 'name'과 'age' 속성을 찾을 때, 해당 속성이 객체에 직접 정의되어 있지 않으면, 'kim.proto'를 통해 'Person.prototype' 객체에서 속성을 찾는다.

.js

console.log(kim.name); // 'Kim'
console.log(kim.age); // 25

만약 'Person.prototype' 객체에서 해당 속성을 찾을 수 없으면, 'Person.prototype.proto'를 통해 부모 객체인 'Object.prototype' 객체에서 속성을 찾는다. 이렇게 부모 객체에서 속성을 찾는 과정이 계속해서 이어지는 것을 '프로토타입 체인'이라고 한다.

.js

console.log(kim.toString()); // [object Object]

위의 코드에서 'kim.toString()'을 호출하면, 'kim' 객체에는 'toString()' 메서드가 없으므로, 'kim.proto'를 통해 'Person.prototype' 객체에서 메서드를 찾을 수 없다. 따라서, 부모 객체인 'Object.prototype' 객체에서 'toString()' 메서드를 찾아 호출한다.