[JS] Constructor Function : Prototype chain

졸면서 강의 듣다가 이해하지 못한 상태에서 Coding Challenge를 하려고 하니 문제를 어떻게 풀어야할지 모르겠어서 정신 차리고 다시 집중해서 강의를 들었다. Constructor Function을 이용하는 이유는, 같은 코드를 똑같이 반복해서 쓰지 않고 같은 속성의 object를 만들기 위함이다.

 

const Person = function(firstName, birthYear) {
  this.firstName = firstName;
  this.birthYear = birthYear;
};

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

const Student = function(firstName, birthYear, course) {
  Person.call(this, firstName, birthYear)
  this.course = course
};

// Link prototypes
Student.prototype = Object.create(Person.prototype);

const mike = new Student('Mike', 2002, 'Culinary Arts');
mike.calcAge(); // 35

Student의 parent class격인 Person의 속성을 가져다 쓰려고 할 때 Person(firstName, birthYear)로 바로 쓰면 될 거 같지만, 앞에 new가 안 붙은 상태에서 일반적인 함수로 인식이 되고 그러면 Person 안에 있는 this가 정의되지 않는다. 그래서 call를 사용하여 argument에 this를 넣어주고 그와 함께 속성을 가지고 온다. 

 

mike가 Person.prototype method 'calcAge'를 쓸 수 있는 이유는, Object.create()를 이용해서 prototype의 체인을 만들어주었기 때문이다. 

 

.call이나 Object.create()는 서로가 연결될 수 있도록 해주는 장치(...인 거 같지?)