"new" 없이 ES6 클래스 생성자 호출

ES6에서 클래스는 생성자 함수의 구문적 설탕입니다. new 키워드 없이 클래스를 호출하면 클래스의 새 인스턴스가 생성되지 않습니다. 대신 클래스의 생성자 함수를 직접 호출합니다.

다음 클래스를 고려하세요.

class Foo {
  constructor(x) {
    if (!(this instanceof Foo)) return new Foo(x);
    this.x = x;
  }
  hello() {
    return `hello ${this.x}`;
  }
}

new 키워드 없이 이 클래스를 호출하려고 하면 오류가 발생합니다.

Cannot call a class as a function

이는 클래스 생성자가 설계되었기 때문입니다. 클래스의 새 인스턴스를 생성합니다. new 연산자 없이 호출하는 것은 일반 함수를 호출하는 것과 동일합니다.

new 키워드 없이 클래스 생성자를 호출할 수 있도록 하려면 다음과 같이 생성자 함수와 화살표 함수의 조합을 사용할 수 있습니다.

class Foo {
  constructor(x) {
    if (!(this instanceof Foo)) return new Foo(x);
    this.x = x;
  }
  hello() {
    return `hello ${this.x}`;
  }
}

const FooWithoutNew = () => new Foo(...arguments);

이제 FooWithoutNew:

FooWithoutNew("world").hello(); // "hello world"

그러나 이 접근 방식에는 몇 가지 단점이 있다는 점에 유의하는 것이 중요합니다. 첫째, 별도의 기능을 만들어야 하는데, 이는 불편할 수 있습니다. 둘째, 새 인스턴스를 반환하는 생성자의 동작을 중단시킵니다.

일반적으로 명확성과 일관성을 위해 항상 new 키워드를 사용하여 클래스 생성자를 호출하는 것이 좋습니다.