200910_TIL

Today I Learned

JavaScript prototype

• 자바스크립트의 객체는 모두 부모를 갖고 있고, 연결되어 있다.
• 부모 객체를 prototype 이라고 한다.
• 자바스크립트에서 거의 모든 객체는 Object의 인스턴스이다. (Object가 가장 선조라는 이야기)
• 객체는 Object.prototype에서 속성과 메소드를 상속받는다. 즉 자식도 속성과 메소드를 사용할 수 있다.
• __proto__는 사실 크롬 브라우저에서 사용하는 프로퍼티명이다.
  • ECMAScript에서는 [[prototype]]이란 이름으로 사용된다.
• prototype과 __proto__의 차이
  
  • prototype은 클래스 생성자의 속성. OOP의 기본이 되는 blueprint를 제공한다.
  • prototype은 함수만 갖고 있는 프로퍼티 (그치만 함수도 객체이므로 __proto__를 갖고 있음)
  • __proto__는 인스턴스의 속성. 즉 blueprint로 제작된 인스턴스
  • __proto__는 모든 객체가 갖고 있는 프로퍼티이다.
  • 부모의 prototype 프로퍼티에 대한 정보를 의미한다. 
  • __proto__는 부모 property를 사용할 수 있으므로, __proto__에 있는 프로퍼티를 직접 사용할 수 있다.
  • prototype에 연결된 메소드는 object.prototype.프로퍼티로 접근해야 한다.

객체 foo에는 prototype이 존재하지 않는다. 반면 함수 boo에는 prototype 프로퍼티가 존재한다.

foo 객체의 __proto__는 Object 객체고, boo 함수의 __proto__는 Function 객체다.

(모든 함수는 Function 객체를, 모든 객체는 Object 객체를 물려받는다.)

boo 함수의 상속과정 | Object -> Function -> boo

 

• prototype chaining은 자식이 특정 속성을 찾을 때 상위 prototype을 거슬러 올라가 찾는 것을 의미한다.
• 객체에 해당 property가 없을 경우 연결되어 있는 prototype을 통해 부모를 참조하여 null이 나올 때까지(Object.prototype) 거슬러 올라가는 것