Pourquoi certaines fonctions fléchées renvoient-elles « undéfini » alors que d'autres ne le font pas ?

Comprendre les valeurs de retour dans les fonctions fléchées : un dilemme entre explicite et implicite

Les fonctions fléchées, introduites dans ES6, ont gagné en popularité pour leur syntaxe concise et flexibilité. Cependant, un piège courant qui afflige les programmeurs débutants survient lorsqu'ils traitent leurs valeurs de retour.

Considérez la fonction fléchée suivante :

const f = arg => { arg.toUpperCase(); };

Lorsqu'elle est invoquée, cette fonction renvoie de manière inattendue undéfini. Pourquoi cela se produit-il ?

Le retour implicite dans les fonctions fléchées concises

Les fonctions fléchées offrent deux variantes de syntaxe distinctes : une forme concise sans accolades et une forme plus verbeuse avec accolades. La forme concise renvoie implicitement le résultat de l'expression du corps, éliminant ainsi le besoin d'une instruction return explicite. Ainsi, une fonction fléchée comme arg => arg.toUpperCase(); renvoie automatiquement l'argument en majuscule.

Retours explicites dans les fonctions fléchées entre accolades

D'autre part, les fonctions fléchées avec des accolades utilisent un corps de fonction traditionnel. Dans ce scénario, il n’y a pas de retour implicite. Pour obtenir une valeur à partir d’une telle fonction fléchée, une instruction return explicite doit être utilisée. Modification de notre exemple précédent :

const f = arg => { return arg.toUpperCase(); };

Maintenant, la fonction renverra correctement l'argument en majuscule. Alternativement, nous pourrions utiliser la forme plus concise en omettant les accolades :

const f = arg => arg.toUpperCase();

Dans ce cas, la fonction flèche renvoie implicitement le résultat de l'expression, qui est l'argument en majuscule.

En comprenant la différence entre les retours implicites et explicites dans les fonctions fléchées, vous pouvez éviter les pièges qui surviennent lors de la gestion de leurs valeurs de retour.

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!