W3docs

Objet fonction JavaScript et expressions de fonction nommées (NFE)

Apprenez que les fonctions JavaScript sont des objets : lisez leurs propriétés name et length, attachez des propriétés personnalisées et utilisez les expressions de fonction nommées (NFE) pour une auto-référence fiable.

Les fonctions sont des objets

En JavaScript, toute fonction est un object. Ce seul fait explique beaucoup de comportements qui semblent autrement magiques : vous pouvez passer une fonction comme n'importe quelle valeur, la stocker dans une variable, lire ses propriétés et même lui ajouter vos propres propriétés.

Vous créez déjà des fonctions en permanence avec les déclarations et expressions de fonction. Ce chapitre examine ce qu'est une fonction une fois qu'elle existe : un object doté de propriétés intégrées utiles (name et length), capable de contenir des propriétés personnalisées, et disponible sous une forme spéciale — l'expression de fonction nommée — qui permet à une fonction de se référer à elle-même de façon fiable.

Cette page suppose que vous êtes à l'aise avec les expressions de fonction. Si let f = function() {...} est nouveau pour vous, lisez d'abord ce chapitre.

La propriété name

Chaque fonction possède une propriété name qui contient le nom de la fonction sous forme de string. L'aspect ingénieux est que JavaScript la renseigne même en l'absence de nom à l'endroit évident — un comportement appelé nommage contextuel.

javascript— editable

Le moteur examine l'affectation et copie le nom de la variable sur la fonction anonyme. Cela fonctionne également pour les paramètres par défaut et les méthodes d'object :

javascript— editable

Il n'existe toutefois pas de magie qui fonctionne toujours. S'il n'y a pas de nom et rien depuis quoi en copier un — par exemple une fonction créée à l'intérieur d'un array — name est une string vide :

javascript— editable

La propriété name est pratique pour la journalisation et le débogage : une trace de pile qui affiche at sayHi est bien plus utile que at <anonymous>.

La propriété length

La propriété length d'une fonction retourne le nombre de paramètres déclarés dans sa définition. Les paramètres rest (...rest) et les paramètres avec des valeurs par défaut ne sont pas comptabilisés, et le comptage s'arrête au premier paramètre de ce type.

javascript— editable

Une utilisation courante de length consiste à introspecter un callback. Certaines bibliothèques appellent un gestionnaire différemment selon le nombre d'arguments qu'il attend — par exemple, en traitant un gestionnaire sans argument comme « déclencher une fois pour tous » et un gestionnaire avec un argument comme « déclencher une fois par élément ».

Propriétés personnalisées

Comme une fonction est un object, vous pouvez lui attacher vos propres propriétés. C'est différent d'une variable locale : une propriété vit sur la fonction et survit entre les appels, ce qui en fait un moyen élégant de donner à une fonction son propre état persistant.

Un exemple classique est un compteur d'appels :

javascript— editable

Une propriété de fonction n'est pas la même chose qu'une variable à l'intérieur de la fonction. Une variable locale se réinitialise à chaque appel ; une propriété persiste, et elle est également lisible et modifiable depuis l'extérieur, ce qui la rend utile pour la configuration (par exemple, pour mettre en cache des résultats sur la fonction elle-même).

Expressions de fonction nommées (NFE)

Une expression de fonction nommée est une expression de fonction qui porte un nom après le mot-clé function :

let sayHi = function func(who) {
  console.log("Hello, " + who);
};

Cela semble inhabituel — pourquoi donner un nom à quelque chose déjà affecté à sayHi ? Le nom func est ici spécial de deux façons :

  • Il permet à la fonction de se référer à elle-même de façon fiable depuis son propre corps.
  • Il n'est visible qu'à l'intérieur de la fonction — vous ne pouvez pas appeler func() depuis l'extérieur.

Pourquoi le nom interne est important

Vous pourriez penser pouvoir utiliser simplement la variable externe sayHi pour l'auto-référence. Le problème est que la variable externe peut changer. Avec une NFE, le nom interne pointe toujours vers la fonction courante, quoi qu'il arrive à la variable :

javascript— editable

Si la fonction avait appelé sayHi("Guest") au lieu de func("Guest"), l'appel lèverait une TypeError car sayHi avait été mis à null. Le nom interne est immunisé contre cela.

NFE et récursion

Cette auto-référence est exactement ce dont la récursion a besoin. Une NFE maintient un appel récursif fonctionnel même si la fonction est ultérieurement réaffectée ou passée sous un autre nom — consultez Récursion et pile JavaScript pour une vue d'ensemble complète.

javascript— editable

Notez que l'astuce du nom interne s'applique uniquement aux expressions de fonction. Une déclaration de fonction ne peut pas avoir de nom interne séparé, et elle n'a aucun moyen de masquer un nom à la portée externe, donc elle ne peut pas conserver une auto-référence privée de la même façon.

Quand utiliser ces fonctionnalités

  • Utilisez name pour des journaux et des sorties de débogage plus clairs.
  • Utilisez length lors de l'écriture de bibliothèques qui s'adaptent à l'arité d'un callback.
  • Utilisez des propriétés personnalisées pour donner à une fonction un état persistant (compteurs, caches, configuration) sans fermeture englobante ni variable globale.
  • Utilisez une expression de fonction nommée chaque fois qu'une expression de fonction doit s'appeler elle-même — notamment pour la récursion ou les gestionnaires détachables — afin que l'appel survive à la réaffectation de variable.

Résumé

Une fonction JavaScript est un object que vous pouvez inspecter et étendre. La propriété name donne son nom (souvent renseigné de manière contextuelle), length indique le nombre de paramètres déclarés, et vous pouvez attacher des propriétés personnalisées pour un état persistant. Une expression de fonction nommée ajoute un nom uniquement interne qui permet à une fonction de s'appeler elle-même de façon fiable, ce qui constitue la manière la plus sûre d'écrire des expressions de fonction auto-référentielles et récursives.

Pratique

Pratique
Qu'est-ce qu'une NFE (expression de fonction nommée) en JavaScript ?
Qu'est-ce qu'une NFE (expression de fonction nommée) en JavaScript ?
Was this page helpful?