본문 바로가기

WEB/JavaScript

JS의 데이터 타입 3 (프로토타입)

프로토타입

자바스크립트는 프로토타입 기반 언어이다. 자바스크립트에서는 새로운 객체를 만들어낼 때 부모가 되는 객체를 복사해서 객체를 만든다. 객체의 원형이 되는 부모 객체(프로토타입)를 이용해서 자식 객체(새로운 객체)를 만들어내기 때문에 프로토타입 기반 언어라고 할 수 있다. 이렇게 우리는 프로토타입을 통해서 객체지향적 프로그래밍을 할 수 있다. 그렇다면 이제 프로토타입을 알아보자.

객체와 프로토타입

우선 예시를 통해서 객체와 프로토타입간의 관계를 알아보자.

위의 코드를 실행해보면 cat객체에 toString메서드가 없지만 에러는 나지 않는다. 크롬 콘솔창에서 위의 코드를 작성해보면 밑의 그림처럼 콘솔에 찍힐 것이다.

그리고 Object 옵션을 클릭하고

proto 옵션을 클릭하면

toString 메서드를 찾을 수 있다. ECMAscript 문서를 보면 모든 객체는 [[Prototype]]이라는 접근할 수 없는 프로퍼티를 가지는데 자신의 프로토타입(부모 객체)이 되는 객체를 가리킨다라고 나와있다. proto 프로퍼티는 ECMAscript 표준은 아니지만 대부분의 브라우저에서는 proto 프로퍼티로 구현하여 [[Prototype]] 프로퍼티에 접근할 수 있게 만들었다.

객체의 프로토타입은 객체가 생성될 때 '어떤 방식으로 생성되었는지' 에 따라서 결정된다. 하지만 객체를 생성할 때 결정된 프로토타입은 다른 객체로 바꿀 수 있다. 따라서 부모 객체를 동적으로 바꿀 수 있다는 말이다. 프로토타입에 관한 자세한 설명은 나중에 따로 프로토타입 체이닝에 관해 다룰 때 다시 언급하겠다. 일단은 객체 리터럴Object() 생성자를 통해서 생성된 객체들은 Object.prototype 객체프로토타입 객체(부모 객체)가 된다는 것을 알아두자.

자바스크립트의 모든 객체들은 Object.prototype 객체의 자손들이다. 따라서 Object.prototype의 메소드나 프로퍼티들을 상속받는다. Object.prototype에 포함된 메서드들은 자바스크립트 표준 메서드들로 ECMAscript 문서에 정의되어 있다.

'WEB > JavaScript' 카테고리의 다른 글

JS의 데이터 타입 5 (함수)  (0) 2018.05.17
JS의 데이터 타입 4 (함수)  (0) 2018.05.06
JS의 데이터 타입 2 (객체)  (0) 2018.05.01
JS의 데이터 타입 1 (기본 타입)  (0) 2018.04.22
변수의 유효범위(스코프 scope)  (0) 2018.02.17