Introduction to JavaScript new.target Metaproperty

JavaScript new.target 소개

 

ES6은 new.targetnew 연산자라는 메타 속성을 제공합니다.

new.target은 new 키워드, 점, target 속성으로 구성됩니다. new.target은 모든 기능에서 사용할 수 있습니다.

new.target은 주변 함수에 속한 것입니다. new.target은 함수가 함수로 실행되는지 생성자로 실행되는지 여부를 런타임에 검사하는 데 매우 유용합니다.

부모 클래스 내에서 new 연산자를 사용하여 호출된 특정 파생 클래스를 확인하는 것도 편리합니다.

 

JavaScript 함수의 new.target

Person생성자 함수:

function Person(name) {
    this.name = name;
}

다음과 같이 new 연산자를 사용하여 Person 함수에서 새 객체를 만들 수 있습니다.

 

let john = new Person('John');
console.log(john.name); // john

또는 Person을 함수로 호출할 수 있습니다.

 

Person('Lily');

이것은 웹 브라우저에서 자바스크립트를 실행할 때 창 개체인 전역 개체로 설정되기 때문에 다음과 같이 name 속성이 창 개체에 추가됩니다.

console.log(window.name); //Lily

new 연산자를 사용하여 함수가 호출되었는지 여부를 감지하는 데 도움이 되도록 new.target 메타 속성을 사용합니다.

 

일반 함수 호출에서 new.target은 undefined를 반환합니다. 함수가 new 연산자로 호출된 경우 new.target은 함수에 대한 참조를 반환합니다.

 

 

Person이 함수로 호출되는 것을 원하지 않는다고 가정하면 다음과 같이 new.target을 사용할 수 있습니다.

function Person(name) {
    if (!new.target) {
        throw "must use new operator with Person";
    }
    this.name = name;
}

이제 Person을 사용하는 유일한 방법은 new 연산자를 사용하여 개체를 인스턴스화하는 것입니다. 일반 함수로 호출하려고 하면 오류가 발생합니다.

컨스트럭터의 JavaScript new.target

클래스 생성자에서 new.target은 new 연산자에 의해 직접 호출된 생성자를 참조합니다. 생성자가 부모 클래스에 있고 자식 클래스의 생성자에서 위임된 경우 true입니다.

class Person {
    constructor(name) {
        this.name = name;
        console.log(new.target.name);
    }
}

class Employee extends Person {
    constructor(name, title) {
        super(name);
        this.title = title;
    }
}

let john = new Person('John Doe'); // Person
let lily = new Employee('Lily Bush', 'Programmer'); // Employee

이 예에서 new.target.name은 new.target의 생성자 참조에 대한 사람에게 친숙한 이름입니다.

 

이 자습서에서는 JavaScript new.target 메타 속성을 사용하여 함수 또는 생성자가 new 연산자를 사용하여 호출되었는지 여부를 감지하는 방법을 배웠습니다.

 

 

 

 

참고: https://www.javascripttutorial.net/es6/javascript-new-target/