Constructor (생성자)

function Boseok(age) {
    this.age = age;
}

그냥 함수로 호출하는것과, new 연산자로 객체를 생성하는것에 무슨 차이가 있는지 볼까여?

const boseok = Boseok(123);
console.log(boseok.age); //error

당연히 예상처럼 함수에 리턴하는게 없으므로 boseok객체는 undefined입니다.

그래서 age를 참조할수없는 에러를 뿜어냅니다.

하지만 new 연산자를 사용하면 다르게 작동합니다.

const boseok = new Boseok(123);
console.log(boseok.age); //123

new 연산자를 사용하면 함수를 생성자로 호출합니다. 명시적인 return 구문이 없다면, this가 가리키는 객체를 반환합니다.

new Boseok()은 Boseok.prototype을 상속받은 new 연산자를 사용하여 Boseok 객체의 인스턴스를 생성합니다.

그래서 또 다른 방법으로 인스턴스를 생성하는 방법은 아래와 같습니다.

Object.create(Boseok.prototype)

생성자에 객체를 만들어서 명시적으로 return하면 new 연산자에 관계없이 동작하는 생성자를 만들 수 있습니다.

new 키워드가 빠졌을때 발생하는 this 참조 에러를 예방할 수 있습니다.

팩토리를 사용했을때는 위처럼 장점도 있지만, 단점도 존재합니다.

prototype으로 메소드를 공유하지 않으므로 메모리를 좀 더 사용한다.
팩토리를 상속하려면 모든 메소드를 복사하거나 객체의 prototype에 객체를 할당해 주어야 한다.
new 키워드를 누락시켜서 prototype chain을 끊어버리는 것은 아무래도 언어의 의도에 어긋난다.

new 연산자와 관계없이 동작하게 만들기

생성자는 new 연산자와 관계없이 동작하는게 좋습니다.

위에서 활용했던 코드를 수정해보겠습니다.

/* 기존코드
function Boseok(age) {
    this.age = age;
}
*/
function Boseok(age) {
    const self = this.instanceof Boseok ? this : Object.create(Boseok.prototype);
    self.age = age;
    return self;
}

이런식으로

빌트인객체에서의 constructor (new 연산자)

Number(10)
new Number(10)

결론부터 이야기하자면 new 키워드와 함께 Number 같은 기본 타입의 생성자를 호출하면 객체를 생성하지만 new 없이 호출하면 형 변환만 시킨다.

const num = Number(10);
const numObj = new Number(10);
console.log(typeof num); // number
console.log(typeof numObj); // object
console.log(num === numObj); // false

빌트인객체에 프로토타입을 추가하고 new 연산자를 썼을때, 안썼을때, Array.from으로 유사배열을 배열로 바꾼경우를 모두 확인해봤다.

Array.prototype.test = 'test';

const arr1 = Array(10); // [empty x 10]
const arr2 = new Array(10); // [empty x 10]

const arrayLike = {
    length: 3,
    0: 'boseok',
    1: 'boseok1',
    2: 'boseok2',
};

const arr3 = Array(arrayLike);
const arr4 = new Array(arrayLike);
const arr5 = Array.from(arrayLike);
console.log(arr3.test); //test
console.log(arr4.test); //test
console.log(arr5.test); //test

유사배열을 형변환하려면 Array.from을 사용해야한다. 변환되지않는다.

프로토타입까지 공유하는걸봐서 빌트인객체에서는 형변환 외에 차이가없는것같다.