Protobype 면접질문

자바스크립트 개발자라면 누구나 한번은 Prototype에 대해서 질문을 받아보았을 거라고 생각을 한다. 그만큼 유명하고 자주 출제 하는 단골 면접 질문이다. 하지만 여러 웹사이트를 방문하며 Prototype에 관한 글을 살펴보았지만 간단하고 명료한 답변을 본적이 없다. 그 이유는 내용자체가 간단명료하지 않기 때문이다. 이 글을 읽는 여러분은 운이 좋다. 간단 명료하게 프로토 타입을 정의해볼테니 다음 면접에서는 걱정은 한수 접어두길 바란다. (왜인지 모르겠지만 옛날 필독서 작가 말투를 따라하는중)

 

면접에서는 대게 이렇게 물어본다.

 

Q : 프로토타입이 무엇인가요?

A : (현재의 나) 프로토타입은 JavaScript에서 oop로 개발하기 위해 사용하는 패턴. Javascript의 Class문법은 prototype 기반으로 만들어졌고 상속을 통해 재사용성을 높인다.

 

나의 대답은 이 정도일 거 같다. 이전 promise 처럼 틀린 답은 아니지만 좀 더 보충해야 100점짜리 정답이 될 것 같다. 오늘도 자바스크립트의 면접 필독서 Deep Dive의 내용을 발췌해보자.

 

클래스 기반 객체지향 언어는 클래스를 정의하고 이를 통해 객체 인스턴스를 생성하는데 프로토타입기반 객체지향 언어는 클래스 없이도 객체를 생성할 수 있다.

 

자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있다. 이것은 oop의 상속 개념과 같이 부모 객체의 프로퍼티 와 메소드를 상속받아 사용할 수 있다. 이러한 부모 객체를 프로토타입 객체 또는 프로토타입이라고 한다.

 

자바스크립트 모든 객체는 [[Prototype]]이라는 인터널 슬롯을 가지고 이 값은 null 또는 객체이며 상속을 구현하는데 사용한다. 이 객체의 데이터 프로퍼티는 get 엑세스를 위해 상속되어 자식 객체의 프로퍼티처럼 사용할 수 있다. 하지만 set 엑세스는 허용되지 않는다.

 

[[Prototype]]의 값은 Prototype 객체이며 **proto**accessor property로 접근할 수 있다. proto 프로퍼티에 접근하면 내부적으로 Object.getPrototypeOf가 호출되어 프로토타입 객체를 반환한다.

[[Prototype]] vs prototype 프로퍼티

함수도 객체이므로 인터널슬롯을 갖는다. 하지만 함수 객체는 일반 객체와는 달리 prototype 프로퍼티도 소유한다. Function.prototype을 가리키기 때문이다. 함수 객체가 생성자로 사용될 때 이 함수를 통해 생성된 객체의 부모 역할을 하는 객체를 가리킨다.

constructor

프로토타입 객체는 constructor 프로퍼티를 갖는다. 이 프로퍼티는 객체의 입장에서 자신을 생성한 객체를 가리킨다.

예를 들어 Person() 생성자 함수에 의해 생성된 객체를 foo라 하면 이 foo 객체를 생성한 객체는 Person() 생성자 함수이다. 이때 foo 객체 입장에서 자신을 생성한 객체는 Person() 생성자 함수이며, foo 객체의 프로토타입 객체는 Person.prototype이다. 따라서 프로토타입 객체 Person.prototype의 constructor 프로퍼티는 Person() 생성자 함수를 가리킨다.

⇒ 솔직히 뭔말인지 모르겠다. 내말로 정리하면 Person은 함수로 정의했지만 함수를 생성하는 생성자에 의해 만들어 진 것이고 이의 constructor는 Person이다. 그리고 foo의 constructor는 Person이고 Person.constructor는 Function이다. 이러면 좀 인과관계가 보이는 것 같다.

Prototype chain

JavaScript는 특정 객체의 프로퍼티나 메소드에 접근하려고 할 때 해당 객체에 접근하려는 프로퍼티 또는 메소드가 없다면 [[Prototype]]이 가리키는 링크를 따라 자신의 부모 역할을 하는 프로토타입 객체의 프로퍼티나 메소드를 차례대로 검색한다. 이것을 프로토타입 체인이라고 한다.

 

면접에 나올만한 것들만 발췌해서 정리해보았다.

 

결론

프로토 타입이란 ?
프로토타입은 oop의 상속 개념과 같이 부모 객체의 프로퍼티와 메소드를 상속받아 사용할 수 있는데 이때 부모 객체를 프로토 타입이라고 한다.

 

일반 클래스 언어와 프로토타입 언어의 차이는?

클래스 기반 언어는 Class라는 틀 자체를 상속시킨다. 상속시킨 틀을 이용해서 객체를 생성한다. 하지만, 프로토타입 기반 언어는 객체들을 prototype으로 연결시킨다. 클래스라는 개념이 없기 때문에, 객체들을 연결 할 수 밖에 없다.

 

 

## 참고 레퍼런스

 

- [Deep Dive](https://poiemaweb.com/js-prototype)