[Javascript] object oriented programming in js (prototype)

prototypes

• Classical OOP : classes
  • 클래스라는 blueprint를 이용해서 인스턴스를 생성
  • 클래스에 있는 것들을 모두 복제하여 인스턴스로 만듬
• OOP in js : prototypes
  • 오브젝트는 prototype 오브젝트와 연결되어 있음
  • prototypal inheritance: prototype은 그 prototype에 연결된 모든 오브젝트에 접근할 수 있는 methods를 포함
  • 연결된 prototype 오브젝트들에 모두 delegation 됨
• ex) Array.prototype.map() 과 같은 메서드는 array의 프로토타입에 정의되어있어 array를 만들 때마다 생성하는 것이 아니며, array 인스턴스라면 언제든지 접근 가능함

3 ways of implemeting prototypal inheritance in js

• Constructor functions
• ES6 classes
• object.create()

prototpal inheritance / delegation works

const Person = function (firstName, birthYear) {
  // Instance properties
  this.firstName = firstName;
  this.birthYear = birthYear;

  // Never to this!
  // this.calcAge = function () {
  //   console.log(2037 - this.birthYear);
  // };
};

const jonas = new Person("Jonas", 1991);

Person.prototype.calcAge = function () {
  console.log(2037 - this.birthYear);
};

jonas.calcAge();

• Person의 prototype에 calcAge를 정의
• Person의 인스턴스인 jonas는 prototype chain에 의해 Person.prototype을 사용 가능
• object를 열어보면 __proto__ 라는 항목이 있는데, 이 항목이 Person.prototype
• 최상위의 prototype chain은 Object.prototype

---

ref :
Prototypal inheritance