자바스크립트의 프로토타입

자바와 같은 객체지향 프로그래밍에서는 클래스를 정의하고 이를 통해 객체를 생성하지만 자바스크립트는 생성자 함수로 객체를 생성한다. 이렇게 생성된 객체의 부모 객체가 프로토타입 객체이다.

여기서 주의할 점은 함수 객체의 prototype 프로퍼티와 생성된 객체의 [Prototype]와는 구분이 필요하다. 이를 이해하기 위해서는 객체 생성 규칙을 알아야 한다.

[[prototpy]] 프로퍼티와 prototype 프로퍼티의 차이점

모든 객체는 자신을 생성한 함수의 prototype 프로퍼티가 가르키는 프로토타입 객체를 자신의 부모 객체로 설정한다. 예를 들어, 생성자 함수의 prototype 프로퍼티가 Person이라면 이를 통해 만들어진 객체의 [[Prototype]] 프로퍼티 또한 Person이다.

객체의 [[Prototype]] 프로퍼티는 모든 객체에 존재하는 숨겨진 자신의 프로토타입 객체를 알려주는 역할을 한다.

함수의 prototype 프로퍼티는 함수 입장에서 자신과 링크된 프로토 타입 객체를 가르키고 있다.

프로토타입 체이닝이란

자바스크립트에서 객체는 자신의 부모 역할을 하는 프로토타입의 프로퍼티에도 접근이 가능하다. 이를 가능하게 하는 것이 프로토타입 체이닝이다.

프로토타입 체이닝이란 무언인가?

특정 객체의 프로퍼티나 메서드에 접근하려고 할때 해당 객체에 찾는 메서드가 없다면 [[Prototype]] 링크를 따라 부모 역할을 하는 객체의 프로퍼티를 차례로 검색하는 것을 의미한다.

객체 리터럴과 생성자 함수로 생성된 객체의 프로토타입 체이닝

객체 리터럴로 생성된 객체의 경우 Object가 객체의 프로토타입이 되고, 생성자 함수로 생성된 경우 생성자 함수가 링크 되어 있는 프로토타입이 객체의 프로토타입이 될 것이다.

둘의 프로토타입 체이닝의 방식은 조금 다르지만 기본 원칙은 같다.

“자바스크립트에서 모든 객체는 자신을 생성한 생성자 함수의 prototype 프로퍼티가 가르키는 객체를 자신의 프로토타입 객체로 취급한다.”

프로토타입 체이닝의 종점

어떤 방식으로 생성됐는지에 상관없이 프로토타입 체이닝의 종점은 Object.prototype이다.

프로토타입도 자바스크립트 객체다

프로토타입 객체 역시 자바스크립트의 객체이므로 동적로 프로퍼티를 추가/삭제가 가능하다.

function Person(name){
    this.name = name;
}

Person.prototype.getName = function(){
    return this.name
}

뿐만 아니라 프로토타입 객체를 변경할 수 있다.

Person.prototype = {
    country: 'korea'
}

참고서적 : 인사이드 자바스크립트 by 송형주, 고현준