[JS/TIL] 생성자함수와 프로토타입

김재범·2022년 11월 27일
0
post-thumbnail

객체

속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적인 자료구조

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

-> 객체의 상태(state)를 나타내는 데이터와 상태데이터를 조작할 수 있는 동작을 하나의 단위로 묶어 생각

이 때 객체의 상태 데이터를 프로퍼티, 동작을 매서드라 한다.

상속과 프로토타입

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

ex)

// 생성자 함수
  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 생성자 함수가 생성한 모든 인스턴스는 부모 객체의 역할을 하는
  // 프로토타입 Circle.prototype으로부터 getArea 메서드를 상속받는다.
  // 즉, Circle 생성자 함수가 생성하는 모든 인스턴스는 하나의 getArea 메서드를 공유한다.
  console.log(circle1.getArea === circle2.getArea); // true

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

-> 상속에 의해 매서드를 공유할 수 있게 한다.

프로토타입 객체(또는 프로토타입)

  • 객체지향 프로그램의 근간을 이루는 객체간 상속을 구현하기 위해 사용한다.

  • 모든 객체는 [[Prototype]]이라는 내부슬롯을 가진다.

모든 객체는 하나의 프로퍼티를 갖는다. 그리고 모든 프로토타입은 생성자함수와 연결되어 있다.

__proto__는 접근자 프로퍼티

모든 객체는 __proto__ 접근자 프로퍼티를 통해 자신의 프로토타입, 즉 [[Prototype]] 내부 슬롯에 접근할 수 있다.

여기서 name: "Lee" person 객체의 프로퍼티
__proto__는 object.prototype의 접근자 프로퍼티
[[Prototype]]이 person 객체의 프로토타입이다.

__proto__ 접근자 프로퍼티를 코드내에서 직접 사용하는 것은 권하지 않는다. 왜냐하면 모든 객체가 __proto__ 프로퍼티를 사용할 수 없기 때문이다.
대신 프로토타입의 참조를 취득하고 싶을 경우 Object.getPrototypeOf
교체하고 싶을 경우 Object.setPrototypeOf 매서드 사용을 권한다.

profile
지식을 쌓고 있습니다.

0개의 댓글