[인사이드 자바스크립트] 자바스크립트 데이터 타입과 연산자 3 - 프로토타입

자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. 그리고 이것은 마치 객체지향의 상속 개념과 같이 부모 객체의 프로퍼티를 마치 자신의 것처럼 쓸 수 있는 것 같은 특징이 있다. 자바스크립트에서는 이러한 부모 객체를 프로토타입 객체(a.k.a 프로토타입)라고 부른다.

 

 

예제에서 생성한 foo 객체에는 toString()이라는 메서드가 없으므로 오류가 발생해야 하지만, 정상적으로 결과가 출력되었다. 에러가 발생하지 않고 예제가 실행될 수 있는 이유는 바로 foo 객체의 프로토타입에 toString() 메서드가 이미 정의되어 있고, foo 객체가 상속처럼 toString() 메서드를 호출했기 때문이다.

 

 

foo 객체를 출력했을 때 name, age 외에 __proto__ 프로퍼티가 있다는 것을 확인할 수 있다. 이 프로퍼티가 foo 객체의 부모인 프로토타입 객체를 가리킨다. 

 

ECMAScript 명세서에는 자바스크립트의 모든 객체는 자신의 프로토타입을 가리키는 [[Prototype]]라는 숨겨진 프로퍼티를 가진다고 설명하고 있다. 크롬 브라우저에서는 __proto__가 바로 이 숨겨진 [[Prototype]] 프로퍼티를 의미한다.

→ foo 객체는 자신의 부모 객체를 __proto__ 라는 내부 프로퍼티로 연결하고 있는 것이다.

 

위와 같이 객체 리터럴 방식으로 생성된 객체의 경우 Object.prototype 객체가 프로토타입 객체가 된다.

 

 

 

또한, 객체를 생성할 때 결정된 프로토타입 객체는 임의의 다른 객체로 변경하는 것도 가능하다.

→ 부모 객체를 동적으로 바꿀 수도 있는 것이다. 

자바스크립트에서는 이러한 특징을 활용해서 객체 상속 등의 기능을 구현한다.