하루 30분 모던 자바스크립트 딥 다이브 프로토타입2

프로토타입의 생성 시점

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

사용자 정의 생성자 함수

  1. 생성자 함수 즉 constructor는 함수 객체를 생성하는 시점에 프로토타입도 더불어 생성된다.
  2. non-constructor는 프로토타입이 생성되지 않는다.
  3. 함수 선언문은 런타임 이전 JS엔진에 의해 먼저 실행되므로 (호이스팅) 어떤 코드보다 먼저 평가되어 함수 객체가 된다. 이때 프로토타입도 더불어 생성된다.
  4. 생성된 프로토타입은 생성자 함수의 prototype 프로퍼티에 바인딩 된다.

빌트인 생성자 함수

  1. 모든 빌트인 생성자 함수는 전역 객체가 생성되는 시점에 생성된다.
  2. 생성된 프로토타입은 생성된 빌트인 생성자 함수의 prototype 프로퍼티에 바인딩 된다.
  3. 객체가 생성되기 이전 생성자 함수와 프로토타입은 객체화 되어있다. 객체를 생성하면 생성된 객체의 [[Prototype]] 내부 슬롯에 프로토타입이 할당되어 상속받는다.

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

  1. 추상연산?
    1. 빈 객체 생성
    2. 객체에 추가할 프로퍼티 목록이 인수로 전달된 경우 프로퍼티를 객체에 추가
    3. 프로토타입을 [[Prototype]] 내부 슬롯에 할당
    4. 생성한 객체를 반환

객체 리터럴에 의해 생성된 객체의 프로토타입

  1. 프로토타입은 Object.prototype

Object 생성자 함수에 의해 생성된 객체의 프로토타입

  1. 프로토타입은 Object.prototype

객체 리터럴과 Object 생성자 함수에 의한 객체 생성 차이는 프로퍼티를 추가하는 방식에 있다.

생성자 함수에 의해 생성된 객체의 프로토타입

  1. 프로토타입은생성자 함수의 prototype에 바인딩되어 있는 객체
  2. 프로토타입에 프로퍼티를 추가/삭제할 수 있고, 즉각 프로토타입 체인에 반영된다

프로토타입 체인

  1. 자바스크립트는 객체의 프로퍼티에 접근하려할 때 해당 객체에 접근하려는 프로퍼티가 없다면 [[Prototype]] 내부 슬롯에 참조를 따라 자신의 부모 역할을 하는 프로토타입의 프로퍼티를 순차적을 검색한다. 이를 프로토타입 체인이라 한다.
  2. 프로토타입의 프로토타입은 언제나 Object.prototype이다. 이를 프로토타입 체인의 종점이라 한다.
  3. Object.prototype에서도 검색할 수 없는 경우 에러가 아닌 undefined를 반환한다.
  4. 스코프 체인과 프로토타입 체인은 서로 협력하여 식별자와 프로퍼티를 검색한다.

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

  1. 프로토타입이 소유한 프로퍼티를 프토토타입 프로퍼티, 인스턴스가 소유한 프로퍼티를 인스턴스 프로퍼티
  2. 프로토타입 프로퍼티와 같은 이름의 프로퍼티를 인스턴스에 추가 하였을 경우, 프로토타입 체인을 따라 인스턴스 프로퍼티를 참조하게 되는데 이를 오버라이딩과 프로퍼티 섀도잉이라 한다.
  3. 인스턴스 프로퍼티가 오버라이딩 한 것이고, 프로토타입 프로퍼티가 섀도잉 당한 것.
  4. 상위 클래스가 가지고 있는 매서드를 하위 클래스가 재정의하여 사용하는 방식이다

프로토타입의 교체

생성자 함수에 의한 프로토타입의 교체

const Person = (function(){
	function Person(name){
		this.name = name;
	}
	Person.prototype = {
		sayHello(){
			console.log(this.name)
		}
	}
	return Person;
})()
const me = new Person('Lee');
  1. Person.prototype에 객체 리터럴을 할당했다.
  2. constructor 프로퍼티가 없다. 따라서 me 객체의 생성자 함수를 검색하면 Object가 나온다.

인스턴스에 의한 프로토타입의 교체

//위 예제에서
const parent = {
	sayHello(){
		console.log(`hi ${this.name}`)
	}
}
Object.setPrototypeOf(me, parent)
  1. 프로토타입 객체를 교체할 때 constructor 프로퍼티를 넣지 않으면 암묵적으로 추가된 constructor 프로퍼티틑 사라진다.
  2. proto 접근자 프로퍼티를 이용하여 프로토타입을 교체하는 것은 이미 생성된 객체의 프로토타입을 교체하는 것이다.

294P의 그림을 보고 복습하자

  1. 프로토타입 교체를 통해 상속 관계를 동적으로 변경하는 것은 좋지않다.