Maison >interface Web >js tutoriel >Différence entre ( )=>{ } et ( )=>( ) fonction aéro en JavaScript (JS)

Différence entre ( )=>{ } et ( )=>( ) fonction aéro en JavaScript (JS)

Susan Sarandon
Susan Sarandonoriginal
2024-12-25 13:51:14120parcourir

Difference between ( )=>{ } et ( )=>( ) fonction aéro en JavaScript (JS){ } et ( )=>( ) fonction aéro en JavaScript (JS)" />

La différence entre ()=>{} et ()=>() réside dans la façon dont ils gèrent les corps de fonction et relevés de retour en JavaScript. Les deux sont des fonctions fléchées, mais elles se comportent légèrement différemment selon la syntaxe utilisée.


1. ()=>{} (Avec accolades)

  • Syntaxe : Lorsque vous utilisez des accolades {} après la flèche (=>), cela définit un corps de fonction.
  • Si vous souhaitez renvoyer une valeur, vous devez utiliser explicitement le mot-clé return.
  • Sans retour, la fonction ne renvoie rien (c'est-à-dire qu'elle renvoie implicitement undéfini).

Exemple :

const add = (a, b) => {
  return a + b; // Explicit return
};

console.log(add(2, 3)); // Output: 5

Points clés :

  • Les accolades indiquent un corps pleinement fonctionnel.
  • Le mot-clé return doit être explicitement utilisé pour renvoyer une valeur.

2. ()=>() (Avec parenthèses)

  • Syntaxe : Lorsque vous utilisez des parenthèses () après la flèche (=>), cela définit un retour implicite.
  • Il s'agit d'un raccourci pour renvoyer directement une seule expression.
  • Le mot-clé return n'est pas nécessaire et aucune accolade n'est utilisée.

Exemple :

const add = (a, b) => a + b; // Implicit return

console.log(add(2, 3)); // Output: 5

Points clés :

  • Les parenthèses indiquent un retour implicite de l'expression unique à l'intérieur.
  • Pas besoin d'utiliser le mot-clé return.

Quand utiliser lequel ?

Utilisez ()=>{} Quand :

  1. La fonction a plusieurs instructions ou une logique complexe.
  2. Vous devez contrôler explicitement ce qui est renvoyé.

Exemple :

const processNumbers = (a, b) => {
  const sum = a + b;
  const product = a * b;
  return sum + product; // Explicitly return the result
};

console.log(processNumbers(2, 3)); // Output: 11

Utilisez ()=>() Quand :

  1. La fonction est une expression sur une seule ligne qui doit renvoyer une valeur.
  2. Vous souhaitez garder la syntaxe concise.

Exemple :

const square = (x) => x * x; // Implicit return

console.log(square(4)); // Output: 16

Cas délicats

Renvoyer un objet littéral

Si vous souhaitez renvoyer un objet littéral en utilisant un retour implicite, vous devez le mettre entre parenthèses. Sinon, JavaScript interprète le {} comme un corps de fonction.

Exemple :

const add = (a, b) => {
  return a + b; // Explicit return
};

console.log(add(2, 3)); // Output: 5

Tableau récapitulatif

Syntax Behavior Example
()=>{} Full function body, explicit return const add = (a, b) => { return a b; };
()=>() Single-line implicit return const add = (a, b) => a b;

Choisissez entre les deux en fonction de votre cas d'utilisation : clarté pour les fonctions complexes (()=>{}) ou syntaxe concise pour les fonctions simples (()=>()).

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