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

자바스크립트에서 모든 객체는 프로토타입을 가집니다. 프로토타입은 객체를 만들기 위한 기본 틀이라고 할 수 있으며, 객체의 메서드나 프로퍼티를 상속받는 데 사용됩니다.

 

프로토타입 체인

 

프로토타입 체인(Prototype Chain)은 객체에서 특정 프로퍼티나 메서드에 접근할 때, 해당 객체에 해당하는 프로퍼티나 메서드가 없으면 상위 객체의 프로토타입에서 해당 프로퍼티나 메서드를 찾는 과정을 말합니다.

 

이 과정은 해당 객체의 프로토타입이 다시 다른 프로토타입을 가지고 있을 경우 계속해서 반복됩니다. 이렇게 상위 프로토타입으로 올라가면서 프로퍼티나 메서드를 찾는 과정을 "프로토타입 체인을 따라 올라가기"라고 합니다.

 

프로토타입 객체 생성

 

프로토타입 객체는 함수 객체에서 생성됩니다. 함수 객체를 생성한 후, prototype 프로퍼티를 이용하여 프로토타입 객체를 생성할 수 있습니다.

 

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

Person.prototype.sayHello = function() {
	console.log("Hello, " + this.name + "!");
};

const person = new Person("John");
person.sayHello(); // "Hello, John!"

 

위 코드에서 Person 함수 객체에 prototype 프로퍼티를 이용하여 sayHello 메서드를 추가하였습니다. 이제 person 객체는 Person 함수 객체의 프로토타입 객체에 있는 sayHello 메서드를 상속받아 사용할 수 있습니다.

 

프로토타입 상속

 

객체는 생성될 때 자신의 프로토타입 객체를 가리키는 [[Prototype]] 내부 슬롯을 가집니다. 이 값은 Object.getPrototypeOf() 함수나 __proto__ 프로퍼티를 이용하여 접근할 수 있습니다.

 

const person = { name: "John" };
const prototype = Object.getPrototypeOf(person);
console.log(prototype === Object.prototype); // true

 

위 코드에서 person 객체는 Object.prototype을 상속받는 것을 확인할 수 있습니다.

 

객체 리터럴로 생성한 객체는 Object.prototype을 상속받습니다. 함수로 생성한 객체는 해당 함수의 프로토타입 객체를 상속받습니다.