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

• 자바스크립트는 프로토타입 기반의 객체 지향 프로그래밍 언어
• 자바스크립트를 이루고 있는 거의 “모든 것”이 객체

 

📍 객체 지향 프로그래밍

• 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임
• 추상화 : 다양한 속성 중에서 프로그램에 필요한 속성만 간추려 표현하는 것
• 객체
  • 속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적인 자료구조
  • 상태 데이터(프로퍼티)와 동작(메서드)를 하나의 논리적 단위로 묶은 복합적인 자료구조

 

📍 상속과 프로토타입

• 상속
  • 어떤 객체의 프로퍼티 또는 메서드를 다른 객체가 상속받아 사용하는 것
  • 자바스크립트는 프로토타입 기반으로 상속 구현
  • 코드 재사용 관점에서 유용

 

📍 프로토타입 객체

• 프로토타입 객체
  • 객체 간 상속을 구현하기 위해 사용됨
  • 프로토타입 : 어떤 객체의 상위 객체(부모) 역할을 하는 객체, 다른 객체에 공유 프로퍼티를 제공
  • 모든 객체는 하나의 프로토타입을 가지며, 모든 프로토타입은 생성자 함수와 연결되어 있음
  • 모든 객체는 [[Prototype]]이라는 내부 슬롯을 가짐
  • ⇒ 이 내부 슬롯에는 직접 접근할 수 없음
  • ⇒ __proto__ 접근자 프로퍼티를 통해 내부 슬롯이 가리키는 프로토타입에 간접적으로 접근 가능
  • ⇒ 내부 슬롯의 값은 프로토타입의 참조
  • 객체가 생성될 때 객체 생성 방식에 따라 프로토타입이 결정되고 [[Prototype]]에 저장

 

📍 __proto__ 접근자 프로퍼티

• 내부 슬롯은 프로퍼티가 아님
• 접근자 프로퍼티는 다른 데이터 프로퍼티의 값을 읽거나 저장할 때 사용하는 접근자 함수임 ([[Get]], [[Set]] 프로퍼티 어트리뷰트로 구성된 프로퍼티)
• 이 접근자 프로퍼티는 객체가 소유하는 프로퍼티가 아닌 Object.prototype의 프로퍼티이며, 상속을 통해 사용됨

 

🔅 Object.prototype

• 자바스크립트 엔진은 객체 프로퍼티에 접근하려고 할 때 해당 객체에 접근하려는 프로퍼티가 없다면 __proto__ 접근자 프로퍼티가 가리키는 참조를 따라 자신의 부모 역할을 하는 프로토타입의 프로퍼티를 순차적으로 검색

 

🔅 proto 접근자 프로퍼티를 통해 프로토타입에 접근하는 이유

• 상호 참조에 의해 프로토타입 체인이 생성되는 것을 방지하기 위함

• 프로토타입 체인은 단방향 링크드 리스트로 구현하여 위와 같은 무한 루프에 빠지지 않도록 함

 

🔅 proto 접근자 프로퍼티를 코드 내에서 직접 사용하는 건 권장하지 않음

• 직접 상속을 통해 Object.prototype을 상속받지 않는 객체를 생성할 수 있으므로 __proto__ 접근자 프로퍼티를 사용할 수 없는 경우도 있음
• 프로토타입의 참조를 취득하고 싶으면 Object.getPrototypeOf 메서드(ES5 도입)를, 프로토타입을 교체하고 싶은 경우에는 Object.setPrototypeOf 메서드(ES6 도입)를 사용하는 것을 권장

 

📍 함수 객체의 prototype 프로퍼티

• prototype 프로퍼티는 함수 객체만이 소유함
• prototype 프로퍼티는 생성자 함수가 생성할 인스턴스의 프로토타입을 가리킴
• non-constructor인 화살표 함숭와 ES6 메서드 축약 표현으로 정의한 메서드는 prototype 프로퍼티를 소유하지 않고 프로토타입도 생성하지 않음

 

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

• 모든 프로토타입은 constructor 프로퍼티를 가짐 (이 프로퍼티는 prototype 프로퍼티로, 자신을 참조하고 있는 생성자 함수를 가리킴, 함수 객체가 생성될 때 이 연결이 이루어짐)

 

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

• 리터럴 표기법에 의해 생성된 객체도 프로토타입이 존재
• 리터럴 표기법에 의해 생성된 객체는 프로토타입의 constructor 프로퍼티가 가리키는 생성자 함수가 반드시 객체를 생성한 생성자 함수라고 말할 순 없음
• 객체 리터럴에 의해 생성된 객체는 Object 생성자 함수가 생성한 객체가 아님
• 프로토타입과 생성자 함수는 단독으로 존재할 수 없으며, 항상 쌍으로 존재

 

📍 프로토타입 생성 시점

• 프로토타입은 생성자 함수가 생성되는 시점에 생성됨
• constructor는 함수 객체를 생성하는 시점에 프로토타입도 생성됨
• non-constructor는 프로토타입이 생성되지 않음
• 모든 빌트인 생성자 함수는 전역 객체가 생성되는 시점에 생성됨
• 객체 생성 전에 생성자 함수와 프로토타입은 이미 객체화되어 존재
• ⇒ 그러면 프로토타입은 생성된 객체의 [[Prototype]] 내부 슬롯에 할당됨
• ⇒ 이렇게 생성된 객체는 프로토타입을 상속 받음
• ⇒ 이후 생성자 함수나 리터럴 표기법으로 객체 생성