Maison  >  Article  >  La différence entre les fonctions fléchées et les fonctions ordinaires

La différence entre les fonctions fléchées et les fonctions ordinaires

百草
百草original
2023-09-13 09:32:212322parcourir

Les différences entre les fonctions fléchées et les fonctions ordinaires résident principalement dans la simplicité de la syntaxe, ces points différents, non applicables aux constructeurs, aux objets sans arguments, etc. Introduction détaillée : 1. Concision de la syntaxe. La syntaxe des fonctions fléchées est plus concise que celle des fonctions ordinaires. Les fonctions fléchées peuvent être définies à l'aide de flèches. Le mot-clé de fonction et les accolades sont omis, et les paramètres et les valeurs de retour de la fonction peuvent être définis. directement définies. Les fonctions fléchées sont utilisées dans Lorsqu'il n'y a qu'un seul paramètre, les parenthèses peuvent également être omises 2. Cela pointe vers différents points, etc.

La différence entre les fonctions fléchées et les fonctions ordinaires

La fonction fléchée et la fonction régulière sont deux façons de définir des fonctions en JavaScript. Elles présentent quelques différences de syntaxe et de fonctionnalité. Ci-dessous, je présenterai en détail la différence entre les fonctions fléchées et les fonctions ordinaires.

1. Simplicité de la syntaxe :

La syntaxe des fonctions fléchées est plus concise que celle des fonctions ordinaires. Les fonctions fléchées peuvent être définies à l'aide de flèches (=>), en omettant le mot-clé de fonction et les accolades, et peuvent définir directement les paramètres et les valeurs de retour de la fonction. Par exemple :

   // 普通函数
   function regularFunc(a, b) {
     return a + b;
   }
   
   // 箭头函数
   const arrowFunc = (a, b) => a + b;

La fonction flèche peut également omettre les parenthèses lorsqu'elle n'a qu'un seul paramètre. Par exemple :

   // 普通函数
   function regularFunc(a) {
     return a * 2;
   }
   
   // 箭头函数
   const arrowFunc = a => a * 2;

2. Ce que cela pointe est différent :

Dans une fonction normale, la valeur de this est déterminée lorsque la fonction est appelée, et elle pointe vers l'objet qui appelle la fonction. Dans les fonctions fléchées, la valeur de this est déterminée lorsque la fonction est définie et pointe vers le contexte dans lequel la fonction fléchée est définie. Cela signifie que la fonction flèche n'a pas son propre this, elle hérite du this de la portée parent. Par exemple :

   // 普通函数
   const obj = {
     name: 'Alice',
     regularFunc: function() {
       console.log(this.name);
     }
   };
   obj.regularFunc(); // 输出:Alice
   
   // 箭头函数
   const obj = {
     name: 'Alice',
     arrowFunc: () => {
       console.log(this.name);
     }
   };
   obj.arrowFunc(); // 输出:undefined

Dans une fonction flèche, cela pointe vers le contexte dans lequel la fonction flèche est définie, et non vers l'objet qui appelle la fonction flèche.

3. Non applicable aux constructeurs :

Les fonctions fléchées ne peuvent pas être utilisées comme constructeurs et les objets ne peuvent pas être instanciés via le nouveau mot-clé. Les fonctions ordinaires peuvent être utilisées comme constructeurs et des instances d'objet peuvent être créées via le nouveau mot-clé. Par exemple :

   // 普通函数
   function RegularConstructor() {
     this.name = 'Alice';
   }
   const regularObj = new RegularConstructor();
   
   // 箭头函数
   const ArrowConstructor = () => {
     this.name = 'Alice';
   };
   const arrowObj = new ArrowConstructor(); // 报错:ArrowConstructor is not a constructor

4. Aucun objet arguments :

Dans une fonction normale, vous pouvez utiliser l'objet arguments pour accéder à tous les paramètres entrants, qui est un objet de type tableau. La fonction flèche n'a pas son propre objet arguments, elle hérite de l'objet arguments dans la portée parent. Par exemple :

   // 普通函数
   function regularFunc() {
     console.log(arguments[0]);
   }
   regularFunc(1, 2, 3); // 输出:1
   
   // 箭头函数
   const arrowFunc = () => {
     console.log(arguments[0]);
   };
   arrowFunc(1, 2, 3); // 报错:arguments is not defined

En résumé, la différence grammaticale entre les fonctions fléchées et les fonctions ordinaires se reflète principalement dans la simplicité et ce pointage. Les fonctions fléchées ont une syntaxe plus concise, mais ne peuvent pas être utilisées comme constructeurs et n'ont pas leurs propres objets this et arguments. La syntaxe des fonctions ordinaires est relativement complexe, mais elle peut être utilisée comme constructeur et possède ses propres objets this et arguments. En utilisation réelle, nous pouvons choisir la méthode de définition de fonction appropriée en fonction des besoins spécifiques.

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