[JavaScript] 모던 자바스크립트 Deep Dive 19장 - 프로토타입

2022. 7. 28. 22:05Web/JavaScript


 

19.1 객체지향 프로그래밍

객체지향 프로그램이란 프로그램을 독립적인 객체의 집합으로 표현하려는 프로그래밍 패러다임을 말한다.


19.2 상속과 프로토타입

상속은 어떤 객체의 프로퍼티 또는 메서드를 다른 객체가 상속받아 그대로 사용할 수 있는 것을 말한다.

 

자바스크립트는 프로토타입을 기반으로 상속을 구현한다.

function Circle(radius){
    this.radius = radius;
}

// Circle 생성자 함수가 생성한 모든 인스턴스가 getArea 메서드를
// 공유해서 사용할 수 있도록 프로토타입에 추가한다.
// 프로토타입은 Circle 생성자 함수의 prototype 프로퍼티에 바인딩되어 있다.

Circle.prototype.getArea = function(){
    return Math.PI * this.radius ** 2;
}

const circle1 = new Circle(1);
const circle2 = new Circle(2);

// Circle 생성자 함수가 생성한 모든 인스턴스는 부모 객체의 역할을 하는
// 프로토타입 Circls.prototype으로부터 getArea 메서드를 상속받는다.
// 즉, Circle 생성자 함수가 생성하는 모든 인스턴스는 하나의 getArea 메서드를 공유한다.

console.log(circle1.getArea === circle2.getArea); // true

console.log(circle1.getArea()); // 3.141592653589793
console.log(circle2.getArea()); // 12.566370614359172

19.3 프로토타입 객체

프로토타입이란 객체지향 프로그래밍의 근간을 이루는 객체 간의 상속을 구현하기 위해 사용된다.


19.3.1 __proto__ 접근자 프로퍼티

  • __proto__ 는 접근자 프로퍼티다.
  • __proto__ 접근자 프로퍼티는 상속을 통해 사용된다.
  • __proto__ 접근자 프로퍼티를 통해 프로토타입에 접근하는 이유는 상호 참조에 의해 프로포타입 체인이 생성되는 것을 방지하기 위해서다.
  • __proto__ 접근자 프로퍼티를 코드 내에서 직접 사용하는 것은 권장하지 않는다.

19.3.2 함수 객체의 prototype 프로퍼티

  • 함수 객체만이 소유하는 prototype 프로퍼티는 생성자 함수가 생성할 인스턴스의 프로토타입을 가리킨다.
  • 화살표 함수와 ES6 메서드 축약 표현으로 정의한 메서드는 prototype을 소유하지 않으며 프로토타입도 생성하지 않는다.
  • 모든 객체가 가지고있는 __proto__ 접근자 프로퍼티와 함수 객체만이 가지고 있는 prototype 프로퍼티는 결국 동일한 프로토타입을 가리킨다.

19.3.3 프로토타입의 constructor 프로퍼티와 생성자 함수

  • 모든 프로토타입은 constructor 프로퍼티를 갖는다.

19.4 리터럴 표기법에 의해 생성된 객체의 생성자 함수와 프로토타입

프로토타입과 생성자 함수는 단독으로 존재할 수 없고 언제나 쌍으로 존재한다.


19.5 프로토타입의 생성시점

프로토타입은 생성자 함수가 생성되는 시점에 더불어 생성된다.


19.6 객체 생성 방식과 프로토타입의 결정

객체의 생성방식

  • 객체 리터럴
  • Object 생성자 함수
  • 생성자 함수
  • Object.create 메서드
  • 클래스(ES6)

 

프로토타입은 추상 연산 OrdinaryObjectCreate에 전달되는 인수에 의해 결정된다. 이 인수는 객체가 생성되는 시점에 객체 생성 방식에 의해 결정된다.


19.7 프로토타입 체인

자바스크립트는 객체의 프로퍼티(메서드 포함)에 접근하려고 할 때 해당 객체에 접근하려는 프로퍼티가 없다면 자신의 부모 역할을 하는 프로토타입의 프로퍼티를 순차적으로 검색한다. 이를 프로토타입 체인이라 한다.


19.8 오버라이딩과 프로퍼티 섀도잉

오버라이딩: 상위 클래스가 가지고 있는 메서드를 하위 클래스가 재정의하여 사용하는 방식

섀도잉: 상속 관계에 의해 프로퍼티가 가려지는 현상