상세 컨텐츠

본문 제목

프로토타입을 왜 사용할까?

Javascript

by 리액트바오 2022. 10. 27. 19:54

본문

 

프로토타입이 언급될때 나는 디자인에서 사용되는 것을 가리키는줄로만 알았다. 

그런데 개발에서의 프로토타입이라는것이 있다는것도 알게 되었다. 개발에서의 프로토타입은 무엇일까? 또 프로토타입을 왜 사용할까? 그리고 프로토타입 체인이란 무엇인지 한번 공부해보자. 

 

먼저 프로토타입을 왜 사용하는지 알기전 개발에서의 프로토타입이란 무엇인지 알아보자.

프로토타입이란?

JavaScript는 흔히 프로토 타입 기반 언어라고 불린다.  쉽게 말하자면 자바스크립트의 모든 객체는 프로토타입(prototype)이라는 객체를 가지고 있다는 것이다.  모든 객체는 그들의 프로토타입으로부터 속성(프로퍼티)과 메소드를 상속받는다.

이처럼 자바스크립트의 모든 객체는 최소한 하나 이상의 다른 객체로부터 상속을 받으며, 이때 상속되는 정보를 제공하는 객체를 프로토타입(prototype)이라고 한다. 

 

자바스크립트의 배열은 Array.prototype 객체를 상속받는 인스턴스이며 이 Array.prototype 은 Object.prototype을 상속받고 있다. 그림으로 그려보았다 ㅋㅋㅋ (다음엔 좀 예쁘게 그려야겠군)

상속되는 정보를 제공하는 객체를 프로토타입(prototype)이라고 한다. 그리고 함수는 모두 prototype 객체를 포함하고 있다.

 

그럼 프로토타입을 왜 사용할까?

자바스크립트는 prototype을 기반으로 상속을 구현한다. 생성자 함수(constructor function)와 new 키워드를 이용하여 인스턴스 객체를 만들어 낸다. 생성자 함수가 정의됨과 동시에 생성자 함수의 프로토타입 객체도 동시에 생성된다. 프로토타입과 인스턴스 객체는 __proto__ 프로퍼티를 가지고 있기 때문에 해당 프로퍼티를 통해 상위 프로토타입에 접근할 수 있다. 이말은 상위 프로토타입의 프로퍼티 및 메서드에 접근할 수 있다는것이다. 이렇게 상위 프로토타입에 있는 프로퍼티와 메서드를 상속받을 수 있다는것은 중복된 코드를 줄여주며 코드의 재사용성을 높일 수 있기 때문에 프로토타입을 사용한다. 

 

그럼 프로토타입 체인이란?

프로토타입이 상속되는 가상의 연결 고리를 프로토타입 체인(prototype chain)이라고 한다. 프로토타입 체이닝은 현재 객체에 해당하는 프로퍼티나 메소드가 없을때 해당하는 프로퍼티와 메소드를 찾아 부모로 올라가며 검색할때  일어난다.

자바스크립트는 특정 객체의 프로퍼티나 메소드에 접근시 객체 자신뿐 아니라 __proto__가 가리키는 링크를 따라서 자신의 부모 역할을 하는 프로토타입 객체로 타고 올라가 프로퍼티나 메소드를 접근할 수 있다. 즉, 특정 객체의 프로퍼티나 메소드에 접근을 했는데 현재 객체에 해당 프로퍼티가 존재하지 않는다면 __proto__가 가리키는 링크를 따라 부모 역할을 하는 프로토타입 객체의 프로퍼티나 메소드를 차례로 검색하여 올라가보는 것이 바로 프로토타입 체인이다. 모든 프로토타입 체이닝의 종점은 Object.prototype으로 Object.prototype 객체는 이러한 프로토타입 체인에서도 가장 상위에 존재하는 프로토타입 이다.

 

 

결론

상위 프로토타입에 있는 프로퍼티와 메소드를 상속받을 수 있기 때문에 중복된 코드를 줄여주고 코드의 재사용성을 높일 수 있기 때문에 프로토타입이란 중요하구나!

관련글 더보기