Comment les fonctions fléchées peuvent-elles simplifier les méthodes de classe dans ES6 ?

Fonctions fléchées comme méthodes de classe dans les classes ES6

Dans les classes ES6, vous pouvez définir des méthodes de classe à l'aide de fonctions fléchées. Cette approche présente plusieurs avantages, notamment :

• Les fonctions fléchées sont liées par défaut à l'instance de classe, éliminant ainsi le besoin d'une liaison explicite.
• Elles fournissent une syntaxe concise et lisible.

Syntaxe

Pour spécifier une méthode de classe à l'aide d'une fonction fléchée, attribuez simplement le fonction de flèche vers une propriété sur l'objet de classe. Cependant, contrairement aux propriétés classiques, les fonctions fléchées ne nécessitent pas le mot-clé this avant la flèche.

Par exemple :

class SomeClass extends React.Component {
  handleInputChange = (val) => {
    console.log('selectionMade: ', val);
  }
}

Portée

Les fonctions fléchées sont liées à la portée lexicale, ce qui signifie qu'elles héritent de la portée de l'objet de classe. Par conséquent, lors de l'appel de la méthode handleInputChange, son contexte sera automatiquement défini sur l'instance de classe, garantissant une portée appropriée.

Utilisation

Vous pouvez transmettre les méthodes de classe de fonction fléchée comme fonctions de rappel sans se soucier de la liaison. Par exemple, vous pouvez attribuer SomeClass.handleInputChange à setTimeout pour planifier un appel de fonction dans le cadre de l'instance de classe.

Configuration

Notez que l'utilisation des fonctions fléchées comme classe les méthodes sont une fonctionnalité expérimentale en JavaScript. Pour activer cette fonctionnalité, vous devez définir l'option "expérimental" sur true dans votre configuration Babel. Vous pouvez y parvenir en installant le plugin Babel transform-class-properties.

La syntaxe de la configuration du plugin Babel est la suivante :

{
  "plugins": [
    "transform-class-properties"
  ]
}

En exploitant les fonctions fléchées comme méthodes de classe, vous peut rationaliser votre code et améliorer la lisibilité tout en garantissant une portée appropriée pour les fonctions de rappel.

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!