[노드JS] 프로토타입 객체 만들기

자바스크립트의 객체를 만들 때는 중괄호를 이용한다고 했다. 그런데 자바스크립트 객체는 함수를 이용해서 만들수도 있다.

그 이유는 함수도 객체이기 때문이다.

함수에 여러가지 기능과 속성이 추가되면서 객체 지향(Object oriented) 언어에서 객체의 원형(Prototype)인 클래스를 만들고, 그 클래스에서 새로운 인스턴스 객체를 여러 개 만들어 내듯이 자바스크립트에서도 객체의 원형을 정의한 후 그 원형에서 새로운 인스턴스 객체를 만들어 낼 수 있다.

▲ 프로토타입 객체를 정의한 후 프로토타입에서 인스턴스 객체 만들기

Person 프로토타입 객체는 데이터를 넣어 두려는 목적보다는 하나의 틀로 사용하기 위해 만든다.

붕어빵 틀에서 실제 붕어빵을 만들어 내듯이 실제 사람을 여러 명 찍어 내기 위한 틀을 프로토타입으로 만든다고 생각하면 이해하기 쉽다.

이 Person 프로토타입에는 사람의 이름을 담는 name 속성과 나이를 담는 age 속성이 들어갈 수 있다.

그리고 walk 함수를 넣어서 걸어가는 동작을 수행할 수도 있다.

프로토타입 객체를 정의하고 나면 new 연산자를 사용하여 인스턴스 객체들을 만들 수 있따.

ch03_test18.js 파일을 만들고 다음과 같이 입력하자.

function Person(name, age){

    this.name = name;

    this.age = age;

}

Person.prototype.walk = function(speed){

    console.log(speed + "km 속도로 걸어간다.");

}

var person01 = new Person('소녀시대', 20);

var person02 = new Person('걸스데이', 22);

console.log(person01.name + '객체의 walk(10)을 호출한다.');

person01.walk(10);

Person 프로토타입 객체를 만들려면 먼저 Person 함수를 정의한다.

자바스크립트에서는 함수도 객체이기 때문에 이 함수는 객체의 역할을 할 수 있다. 즉, 함수 중에서 new 연산자로 호출되는 함수는 객체를 만들기 위한 함수로 분류되며, 이러한 함수를 생성자(Constructor)라고 한다. 따라서 그 객체 안에 name 속성을 만들거나

name 속성에 접근하고 싶다면 this를 사용한다. 함수의 파라미터로 전달받은 name과 age 속성을 이용해서 객체인 this에 name과 age 속성을 추가한다.

※ 여기에서 만드는 객체는 실제 객체로 만들어 사용하기 전 단계인 프로토 타입이다.

※ this는 함수를 호출한 객체이다.

자바스크립트에서 객체 지향 방식으로 코드를 구성하기 위해 생성자 함수로 객체를 만들면, 그 객체 안에서 사용하는 this 키워드는 그 함수를 호출하는 객체를 가리킨다.

Person 객체는 name과 age 속성을 갖게 되었다.

이제 이 객체에 walk 함수를 속성으로 추가하고 싶다면 Person.walk = function() {...}과 같은 형태가 아닌, Person.prototype.walk = function() {...} 과 같은 형태로 만든다.

이것은 Person 객체가 실제 데이터를 담기 위해 만들어진 것이 아닌, 다른 인스턴스 객체를 만들기 위한 원형 틀로 만들어졌기 때문이다.

Person 객체 안에 있는 prototype 속성에 데이터나 함수를 속성으로 추가하면 실제 인스턴스 객체를 만들 때 메모리를 효율적으로 관리할 수 있다.

다음 그림은 Person 객체에서 prototype 속성을 사용하는 방식에 대해 설명한다.

▲Person 객체의 prototype 속성 사용하기

Person 객체 안에 있는 prototype 속성도 객체로 만든 것인데, Person 함수가 만들어질  때 자동으로 만들어진다.

이 prototype 객체는 Person 객체 자신을 가리키도록 되어 있어 다음의 두 코드는 같은 결과를 보여준다.

Person.walk = function() {...}

Person.prototype.walk = function() {...}

다시 말해, 이 두 가지 코드 모두 Person이라는 틀로 만들어 낸 인스턴스 객체에서 walk 함수를 호출할 수 있다.

다만, prototype 속성으로 추가하면 인스턴스 객체를 만들 때 메모리를 효율적으로 관리할 수 있다는 점이 서로 다르다.

그럼 prototype 객체는 언제 만들어진 것일까?

우리들이 prototype 객체를 추가하지 않더라도 함수 객체를 만들 때 함수 안에 prototype이나 constructor와 같은 객체들이 자동으로 만들어진다.

constructor 객체는 생성자라고 하는데, new 연산자로 인스턴스 객체를 만들 때 사용할 수 있으며, 필요한 파라미터를 전달받아 객체의 속성에 할당하거나 필요한 초기화 함수를 실행할 수 있다.

ch03_test18.js 파일을 실행하면 다음과 같이 두 개의 Person 인스턴스 객체를 만든 후 person01 변수에 할당된 첫 번째 인스턴스 객체의 walk() 함수를 호출한 결과를 볼 수 있다.

▲ 프로토타입 객체에서 만들어 낸 인스턴스 객체의 함수를 호출한 결과

새로운 인스턴스 객체들을 만들도록 정의한 Person 객체를 프로토타입 객체라고도 부르는데, 일반적인 함수와 구별해서 이해할 수 있어야 한다.

※ 노드에서 사용하는 자바스크립트와 기본 자바스크립트의 코드패턴은 다를 수 있다는 점 명심하자!