[JavaScript] 객체 리터럴 방식과 생성자 함수로 만든 객체의 차이

이번에는 객체 리터럴 방식과 생성자 함수를 통한 객체 생성의 차이에 대해 알아 보겠다.

다음 예제를 보자.

var kim = {
    name : 'kim',
    age : 40,
    gender : 'man'
};
console.dir(kim);

function Person(name, age, gender){
    this.name = name;
    this.age = age;
    this.gender = gender
}

var man = new Person('kim', 40, 'man');
console.dir(man);

var woman = new Person('kim', 35, 'woman');
console.dir(woman);

kim은 리터럴 방식으로 생성한 객체이고 man과 woman은 Person이라는 생성자 함수로 객체를 생성하였다.

 

콘솔창에 나오는 것을 보면 리터럴 방식으로 생성한 객체는 모든 객체의 조상인 Object객체와 연결되어 있다. 반면 생성자 함수로 생성한 객체는 자신을 만든 생성자 객체인 Person.prototype을 참조하고 있음을 알 수 있다.

참고로 자바스크립트 함수는 함수가 생성될 때 constructor 프로퍼티 하나만 있는 객체를 생성해서 함수의 prototype과 연결한다. Person 생성자 함수를 통해서 만든 객체의 constructor 프로퍼티를 보면 Person 객체가 매핑되어 있음을 알 수 있다.