자바스크립트 - 상속

기존의 Class 기반 언어는 Class로 객체의 자료구조와 기능을 정의하고 생성자를 통해 인스터를 생성한다.
자바스크립트의 경우는 ES6에서 Class문법을 사용하게 되었고,
그렇다면 ES6이전에는 상속을 어떻게 구현했을까?

상속을 구현하는 4가지 방법

1. Functional

var Car = function(postion) {
  var someInstance = {};
  someInstance.position = position;
  someInstance.move = function() {
    this.position += 1;
  }
  return someInstance;
};

var car1 = Car();
var car2 = Car();
car1.move();

2. Functional Shared
이전의 Functional 방식은 인스턴스를 생성할 때 모든 메소드를 someInstance에게 할당하므로, 각각의 인스턴스들이 메소드 수 만큼 메모리를 더 차지하는 단점이 있다.
Functional Shared방식에서는 someMethods라는 객체에 있는 메소드들의 메모리 주소만을 참조하기 때문에 메모리 측면에서 보다 효율적이다.

var extend = function(to, from) {
  for(var key in from) {
    to[key] = from[key];
  }
};

var someMethods = {};
someMethods.move = function() {
  this.position += 1;
};
  
var Car = function(position) {
  var someInstance = {
    position: position,
  }
  extend(someInstance, someMethods);
  return someInstance;
};

3. Prototypal
Object.create

var someMethods = {};
someMethods.move = function(){
  this.position += 1;
};
var Car = function(position) {
  var someInstance = Object.create(someMethods);
  someInstance.position = position;
  return someInstance;
}
var car1 = Car(5);
var car2 = Car(10);

4. Pseudoclassical

var Car = function(position) {
  this.position = position;
};

Car.prototype.move = function() {
  this.position += 1;
};

var car1 = new Car(5);
var car2 = new Car(10);

Prototypal Model vs Classical Model

Reference

• The Definitive Guide to Object-Oriented JavaScript