> 웹 프론트엔드 > JS 튜토리얼 > `new.target`은 어떻게 ES6 클래스에서 상속을 활성화하고 생성자 호출을 차별화합니까?

`new.target`은 어떻게 ES6 클래스에서 상속을 활성화하고 생성자 호출을 차별화합니까?

Mary-Kate Olsen
풀어 주다: 2024-11-03 11:53:29
원래의
500명이 탐색했습니다.

How does `new.target` Enable Inheritance and Differentiate Constructor Calls in ES6 Classes?

"new.target" 이해

정의 및 위치

ECMAScript 2015 사양에서는 세 번만 언급되었음에도 불구하고 "new.target"은 §12.3.8에 정의된 메타 속성.

목적 및 사용법

"NewTarget"은 현재 함수 환경의 [[NewTarget]] 내부 속성 값을 검색합니다. 이 값은 함수가 생성자로 호출될 때 설정됩니다.

new를 사용하여 함수가 호출되면 new.target은 새 인스턴스를 생성하는 데 사용되는 생성자 함수를 참조합니다. 이를 통해 개발자는 생성자 호출과 일반 함수 호출을 구별할 수 있습니다.

ES6 클래스의 중요성

"NewTarget"은 ES6 클래스에서 중요한 역할을 합니다. 클래스 생성자가 new로 호출되면 처음에는 초기화되지 않은 this를 반환합니다. 그러나 super()는 new.target을 인수로 전달하는 동안 상위 생성자를 호출하여 이를 초기화합니다.

이 메커니즘을 사용하면 클래스가 Array 또는 Map과 같은 내장 객체에서 상속받을 수 있습니다. new.target을 상위 생성자에 전달하면 올바른 프로토타입 체인이 설정되어 새 인스턴스가 적절한 프로토타입 객체에서 상속되도록 보장합니다.

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

class Parent {
  constructor() {
    // new.target = Child (from super() call)
    console.log(new.target);
  }
}

class Child extends Parent {
  constructor() {
    // new.target = Child (from new call)
    super();
    console.log(this);
  }
}

new Child;
로그인 후 복사

이 예에서 new.target은 다음과 같습니다.

  • Parent 생성자의 하위(super() 호출에서 호출됨)
  • Child 생성자의 하위 (new로 호출됨)

출력은 다음과 같습니다.

Child
{ __proto__: Child.prototype }
로그인 후 복사

이는 new.target을 사용하여 생성자와 일반 함수 호출을 구별하는 방법을 보여줍니다. ES6 클래스에서 상속을 관리합니다.

위 내용은 `new.target`은 어떻게 ES6 클래스에서 상속을 활성화하고 생성자 호출을 차별화합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿