상속(Inheritance)

상속은 객체의 로직을 그대로 물려 받는 또 다른 객체를 만들 수 있는 기능을 의미한다. 단순히 물려받는 것이라면 의미가 없을 것이다. 기존의 로직을 수정하고 변경해서 파생된 새로운 객체를 만들 수 있게 해준다.

상속의 구체적인 수단인 prototype에 대해서 자세히 알아보자.

Prototype

그럼 prototype이란 무엇인가? 한국어로는 원형정도로 번역되는 prototype은 말 그대로 객체의 원형이라고 할 수 있다. 함수는 객체다. 그러므로 생성자로 사용될 함수도 객체다. 객체는 프로퍼티를 가질 수 있는데 prototype이라는 프로퍼티는 그 용도가 약속되어 있는 특수한 프로퍼티다. prototype에 저장된 속성들은 생성자를 통해서 객체가 만들어질 때 그 객체에 연결된다.

function Ultra(){}
Ultra.prototype.ultraProp = true; // Ultra의 prototype 속성에 ultraProp이라는 속성을 담음
 
function Super(){}
Super.prototype = new Ultra(); // Super의 prototype 속성에 객체 Ultra가 담김
 
function Sub(){}
Sub.prototype = new Super(); // Sub의 prototype 속성에 객체 Super가 담김
 
var o = new Sub();
console.log(o.ultraProp); // true

Prototype Chain

생성자 Sub를 통해서 만들어진 객체 o가 Ultra의 프로퍼티 ultraProp에 접근 가능한 것은 prototype 체인으로 Sub와 Ultra가 연결되어 있기 때문이다. 내부적으로는 아래와 같은 일이 일어난다.

1. 객체 o에서 ultraProp를 찾는다.
2. 없다면 Sub.prototype.ultraProp를 찾는다.
3. 없다면 Super.prototype.ultraProp를 찾는다.
4. 없다면 Ultra.prototype.ultraProp를 찾는다.

prototype는 객체와 객체를 연결하는 체인의 역할을 하는 것이다. 이러한 관계를 prototype chain이라고 한다.

❗️ Super.prototype = Ultra.prototype 이런식으로 상속하면 안된다. 이런식으로 사용하면 Super.prototype의 값을 변경하면 그것이 Ultra.prototype도 변경하기 때문이다.
Super.prototype = new Ultra();는 Ultra.prototype의 원형으로 하는 객체가 생성되기 때문에 new Ultra()를 통해서 만들어진 객체에 변화가 생겨도 Ultra.prototype의 객체에는 영향을 주지 않는다.

출처 : 생활코딩 - Javascript