자바스크립트 프로토타입이란?

프로토타입이란?

프로토타입(prototype)은 프로토타입 객체의 줄임말로 자바스크립트에서 상속을 구현하는 방식입니다. 모든 객체에는 하나의 프로토타입이 존재하며, 이는 모두 생성자 함수와 연결되어 있습니다. 프로토타입을 통해 자식 객체는 부모 객체의 프로퍼티를 자유롭게 사용할 수 있습니다.

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

Person.prototype.age = 31;

const person = new Person("Hwi");

console.log(person.age); // 31

프로토타입 체인

자바스크립트는 객체의 프로퍼티에 접근했으나 해당 프로퍼티가 존재하지 않는다면, 해당 객체의 부모 역할을 하는 프로토타입의 프로퍼티를 탐색합니다. 이러한 계층 구조적 메커니즘을 프로토타입 체인이라 합니다.

 

자식 객체가 특정한 프로퍼티를 이미 갖고 있는 경우 부모 객체의 프로퍼티가 아닌 자신의 프로퍼티를 사용합니다.

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

Person.prototype.age = 31;

const person = new Person("Hwi", 20);

console.log(person.age); // 20

constructor를 통한 생성자 함수 확인

모든 프로토타입은 contructor 프로퍼티를 갖습니다. (constructor는 참조하고 있는 생성한 생성자 함수를 가리킵니다.)

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

const me = new Person("Hwi")

console.log(me.constructor === Person); // true

 

객체, 함수, 배열, 정규 표현식 리터럴은 Object, Function, Array, RegExp와 같은 생성자 함수를 통해 생성되며, constructor를 통해 이를 확인할 수 있습니다.

const obj {};
console.log(obj.constructor === Object) // true

function foo() {}
console.log(foo.constructor === Function); // true

const arr [];
console.log(arr.constructor === Array) // true

마치며

프로토타입은 자바스크립트에서 상속을 구현하는 방식입니다. 상속을 통해 한 객체의 프로퍼티와 메소드를 다른 객체가 사용할 수 있게 되며, 이는 객체 지향 프로그래밍의 핵심입니다.