Il existe plusieurs types de décorateurs dans es6

Il existe deux types de décorateurs es6. Les décorateurs ne peuvent être utilisés que pour les classes et les méthodes de classe, ils peuvent donc être divisés en : 1. Décorateurs de classe, utilisés pour décorer la classe entière, la syntaxe est « @ nom de la fonction » 2. Décorateurs de méthodes de classe, utilisés pour décorer les méthodes de ; la classe, la syntaxe est "@ nom de la fonction nom de la méthode".

L'environnement d'exploitation de ce tutoriel : système Windows 10, ECMAScript version 6.0, ordinateur Dell G3.

Il existe plusieurs types de décorateurs es6

Il existe deux types de décorateurs es6.

Decorator est une syntaxe liée à une classe, utilisée pour annoter ou modifier des méthodes et propriétés liées à la classe. De nombreux langages orientés objet possèdent cette fonctionnalité. Généralement lié aux cours, n'utilisez pas de méthodes ordinaires.

Un décorateur est une fonction, écrite @ + nom de la fonction. Il peut être placé avant la définition des classes et des méthodes de classe. Le décorateur doit exécuter la fonction et ajouter des conditions de contrôle à la classe ou aux méthodes d'attribut sous la classe.

Les décorateurs ne peuvent être utilisés que pour les classes et les méthodes de classe, pas pour les fonctions en raison du levage de fonctions.

1. Décorateur de classe

Le décorateur de classe est utilisé pour décorer toute la classe

L'exemple est le suivant :

@decorateClass
class Example {
    //...
}
 
function decorateClass(target) {
    target.isTestClass = true
}

Comme dans le code ci-dessus, le décorateur @decorateClass modifie le comportement de toute la classe Exemple et ajoute attributs statiques à la classe Exemple isTestClass. Le décorateur est une fonction. Le paramètre target dans la fonction decorClass est la classe Exemple elle-même, qui est également équivalente au constructeur de classe Exemple.prototype.constructor.

2 Décorateur de méthode de classe

Le décorateur de méthode de classe est utilisé pour. décorer la méthode de classe

Les exemples sont les suivants :

class Example {
    @log
    instanceMethod() { }
 
    @log
    static staticMethod() { }
}
 
function log(target, methodName, descriptor) {
  const oldValue = descriptor.value;
 
  descriptor.value = function() {
    console.log(`Calling ${name} with`, arguments);
    return oldValue.apply(this, arguments);
  };
 
  return descriptor;
}

Comme dans le code ci-dessus, le décorateur @log décore respectivement la méthode d'instance instanceMethod et la méthode statique staticMethod. La fonction du décorateur @log est d'exécuter console.log pour afficher le journal avant d'effectuer l'opération d'origine.

【Recommandations associées : tutoriel vidéo javascript, front-end web】

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!