자바스크립트는 객체 지향 프로그래밍을 지원하는 언어로, 생성자 함수와 프로토타입 체인을 통해 상속을 구현할 수 있습니다. 이번 포스트에서는 생성자 함수와 프로토타입 체인의 상속 규칙과 우선순위에 대해 알아보겠습니다.

생성자 함수 기반의 상속

생성자 함수를 이용하여 객체를 생성하고 상속을 구현할 수 있습니다. 생성자 함수로부터 객체를 생성하는 과정에서 prototype 속성을 이용하여 프로토타입 체인을 형성합니다.

function Animal(name) {
  this.name = name;
}

Animal.prototype.getName = function() {
  return this.name;
};

function Cat(name, color) {
  Animal.call(this, name);
  this.color = color;
}

Cat.prototype = Object.create(Animal.prototype);
Cat.prototype.constructor = Cat;

Cat.prototype.getColor = function() {
  return this.color;
};

위의 예제에서 Animal 생성자 함수는 name을 인자로 받아 객체를 생성하고, Cat 생성자 함수는 name과 color를 인자로 받아 Animal 생성자 함수를 호출하여 부모 객체를 초기화합니다. Cat 생성자 함수의 프로토타입 객체를 Object.create()를 사용하여 Animal의 프로토타입 객체로 설정하고, constructor 속성을 다시 Cat로 지정합니다.

이렇게 생성된 객체는 getName() 메소드를 호출할 수 있으며, 프로퍼티와 메소드는 프로토타입 체인을 통해 찾을 수 있습니다.

프로토타입 체인의 우선순위

프로토타입 체인은 상속 관계에서 메소드나 프로퍼티를 찾는 순서를 결정합니다. 메소드나 프로퍼티를 호출할 때, 먼저 해당 인스턴스의 자신의 프로퍼티와 메소드가 있는지 확인한 후 없으면 프로토타입 체인을 따라 부모 객체의 프로퍼티와 메소드를 검색합니다.

let cat = new Cat('Nabi', 'black');
cat.getName(); // 'Nabi'
cat.getColor(); // 'black'

위의 예제에서 cat 인스턴스는 Cat 생성자 함수로부터 생성되었으며, Cat의 프로토타입인 Animal의 메소드인 getName()과 getColor()를 호출할 수 있습니다. 이때, cat 인스턴스의 자신의 프로퍼티인 name과 color이 있으면 그 값을 반환하고, 없으면 프로토타입 체인을 따라 부모 객체의 프로퍼티를 검색합니다.

결론

자바스크립트에서 생성자 함수와 프로토타입 체인을 이용하여 상속을 구현할 수 있습니다. 생성자 함수로부터 객체를 생성하고 프로토타입 체인을 형성하여 부모 객체의 메소드와 프로퍼티를 상속받을 수 있습니다. 프로토타입 체인을 통해 상속받은 메소드와 프로퍼티는 우선순위에 따라 검색되며, 자식 객체에서 재정의된 경우 자식 객체의 값이 우선적으로 사용됩니다.

#javascript #상속