프로토타입 prototype (3) : 리터럴 표기법에 의해 생성된 객체의 생성자 함수와 프로토타입

생성자 함수에 의해 생성된 인스턴스는 프로토타입의  constructor 프로퍼티에 의해 생성자 함수와 생성자 함수와 연결된다. 이 때 constructor 프로퍼티가 가리키는 생성자 함수는 인스턴스를 생성한 생성자 함수다.

 

하지만 리터럴 표기법에 의한 객체 생성 방식과 같이 명시적으로 new 연산자와 함께 생성자 함수를 호출하여 인스턴스를 생성하지 않는 객체 생성 방식도 있다.

// 객체 리터럴
const obj = {};

// 함수 리터럴
const add = function (a, b) {return a + b};

// 배열 리터럴
const arr = [1,2,3];

// 정규표현식 리터럴
const regexp = /is/ig;

 

 

리터럴 표기법에 의해 생성된 객체도 프로토타입이 존재한다. 그러나 리터럴 표기법에 의해 생성된 객체의 경우, 프로토타입의 constructor 프로퍼티가 가리키는 생성자 함수가 반드시 객체를 생성한 생성자 함수라고 단정할 수는 없다.

 

// 리터럴 방식으로 생성
const obj = {};

// 그러나 obj의 생성자 함수는 Object 생성자 함수다
console.log(obj.constructor === Object); // true

//-----

//생성자로 객체를 만든 경우
function Person(name) {
	this.name = name;
}

const me = new Person('Lee');
console.log(me.constructor === Person); // true

 

Object 생성자 함수에 인수를 전달하지 않거나 undefined, 또는 null을 인수로 전달하면서 호출하면 내부적으로는 추상 연산(abstract operation) OrdinaryObjectCreate를 호출하여 Object.prototype을 프로토타입으로 갖는 객체를 생성한다.

 

// 인수가 전달되지 않았을 때 OrdinaryObjectCreate를 호출하여 빈 객체 생성
let obj = new Object();
console.log(obj); // {}

// new.target이 undefined이거나 Object가 아닌 경우
class Foo extends Object{};
new Foo() // Foo {}

//인수가 전달된 경우에는 인수를 객체로 변환
obj = new Object(123);
console.log(obj); // Number {123}

// String 객체 생성
obj = new Object('123');
console.log(obj); // String {"123"}

 

Object 생성자 함수 호출과 객체 리터럴의 평가는 추상 연산 OrdinaryObjectCreate를 호출하여 빈 객체를 생성하는 점에서는 동일하다. 그러나 new.target의 확인이나 프로퍼티를 추가하는 처리 등 세부 내용은 다르다. 따라서 객체 리터럴에 의해 생성된 객체를 Object 생성자 함수가 생성한 객체가 아니다.( 엄격하게 본다면! 객체 리터럴로 객체를 생성하면 Object생성자로 생성한 객체와는 다른 객체가 만들어진다는 의미이다)

 

리터럴 표기법에 의해 생성된 객체도 상속을 위해 프로토타입이 필요하다. 따라서 리터럴 표기법에 의해 생성된 객체도 가상의 생성자 함수를 갖는다. 프로토타입은 생성자 함수와 더불러 생성되며 prototype, constructor 프로퍼티에 의해 연결돼 있기 때문이다. 다시 말해 프로토타입과 생성자 함수는 단독으로 존재할 수 없고 언제나 쌍(pair)로 존재한다. (객체 리터럴로 만들었다고 해도 프로토타입을 만들 때에는 생성자 함수가 필요하며, 그렇기 때문에 가상의 생서자 함수를 갖게 된다는 의미)

 

 

즉, 리터럴 방식으로 만든 객체도 결과적으로 생성자 함수와 연결 되므로 본질적으로는 생성자 함수로 만든 객체와 동일한 특성을 갖는다. 다만 생성 과정이 다르다.