Maison >interface Web >js tutoriel >Comment « new.target » nous aide-t-il à comprendre l'héritage dans les classes ES6 ?

Comment « new.target » nous aide-t-il à comprendre l'héritage dans les classes ES6 ?

DDD
DDDoriginal
2024-10-29 00:45:30877parcourir

How does `new.target` help us understand inheritance in ES6 classes?

Comprendre "new.target" en JavaScript

Le terme "new.target" apparaît avec parcimonie dans la spécification ECMAScript 2015 (14.2.3 et 14.2.16), ce qui soulève des questions sur son objectif. Fait intéressant, son nom complet est NewTarget, trouvé au §12.3.8.

Metadata et NewTarget

NewTarget est une méta-propriété qui récupère la valeur actuelle du [[NewTarget]] dans le courant environnement de fonction sans flèche. Lorsqu'une fonction est appelée, une valeur [[NewTarget]] est attribuée, similaire à la liaison this.

Identification des appels de constructeur

Auparavant, détecter si une fonction était appelée en tant que constructeur n'était pas explicitement pris en charge. Cependant, NewTarget résout ce problème en révélant si la méthode interne [[Construct]] a créé l'enregistrement d'environnement. Selon le §8.1.1.3, si l'enregistrement d'environnement a été créé par [[Construct]], [[NewTarget]] contient la valeur du paramètre [[Construct]] newTarget. Sinon, il reste indéfini.

Héritage dans les classes ES6

Bien que du sucre syntaxique, les classes ES6 offrent un véritable héritage. C'est là que NewTarget joue un rôle crucial. Lors de l’appel d’un constructeur de classe à l’aide de new X, la valeur this n’est initialement pas définie. L'appel super() dans le constructeur crée l'objet mais hérite du .prototype du constructeur initialement appelé.

NewTarget capture le constructeur le plus externe qui a reçu le nouvel appel. Ce n'est pas le constructeur en cours d'exécution. Cette valeur est ce qui est transmis à la procédure OrdinaryCreateFromConstructor, garantissant que l'instance hérite correctement du prototype souhaité.

Exemple

Pour illustrer, considérons les classes suivantes :

<code class="javascript">class Parent {
    constructor() {
        // implicit (from the `super` call)
        //    new.target = Child;
        // implicit (because `Parent` doesn't extend anything):
        //    this = Object.create(new.target.prototype);
        console.log(new.target) // Child!
    }
}
class Child extends Parent {
    constructor() {
        // `this` is uninitialised (and would throw if accessed)
        // implicit (from the `new` call):
        //    new.target = Child 
        super(); // this = Reflect.construct(Parent, [], new.target);
        console.log(this);
    }
}
new Child;</code>

Dans cet exemple, NewTarget permet à la classe Parent de reconnaître qu'elle a été appelée en tant que constructeur via la classe Child. La classe Child utilise ensuite ces informations lors de son appel super() pour établir correctement l'héritage.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn