Fonctions de générateur en JavaScript – Blogs parfaits

Si vous êtes développeur JavaScript depuis un certain temps et que vous avez entendu parler des concepts d'ECMAScript 6 (ES6), vous devez avoir rencontré des fonctions de générateur. Vous vous demandez peut-être quelles sont les fonctions du générateur? Pourquoi en avons-nous besoin? Quels problèmes résolvent-ils?

Nous pouvons trouver la réponse, mais nous devons prendre du recul et réexaminer les fonctions régulières pour comprendre ce qu'est une fonction génératrice. Nous avons tous utilisé des fonctions normales à divers endroits. Une fonction normale commence à partir de la toute première ligne de la fonction, s'exécute jusqu'à la fin jusqu'à ce qu'elle renvoie des valeurs ou la dernière ligne de fonction, et ne renvoie qu'une seule valeur unique.

Que faire si nous voulons renvoyer plusieurs valeurs et suspendre une fonction exécution? C’est possible en JavaScript, et nous pouvons y parvenir à l’aide des fonctions du générateur .

Informations clés sur les fonctions du générateur

Une fonction du générateur est assez différente des fonctions normales. Pour créer un générateur, nous devrons utiliser «fonction *» comme construction syntaxique.

Fournir un «*» après un mot-clé de fonction indique que vous créez une fonction de générateur. Nous pouvons écrire une fonction de générateur dans l'image ci-dessous:

L'image ci-dessus montre à quoi ressemblera la définition d'une fonction de générateur. Le mot-clé «yield» met en pause / reprend la fonction du générateur et renvoie la valeur de l'expression à l'appelant du générateur. Chaque fois qu'une fonction de générateur est appelée à s'exécuter et que nous essayons de consigner son type, elle retournera la sortie comme ceci:

Une fonction de générateur renvoie un objet spécial appelé «objet générateur», qui est un type d'itérateurs . Un itérateur est un objet qui définit une séquence d'itération (comme un tableau en JavaScript) et renvoie potentiellement une valeur à sa fin.

Fonctionnement d'une fonction de générateur

L'appel de fonctions de générateur n'est pas similaire à l'appel de fonctions normales normales. Pour appeler une fonction de générateur, nous devrons l'appeler en utilisant la méthode «next ()». Lorsque nous appelons une fonction de générateur avec la méthode next (), elle exécutera l'exécution jusqu'à l'instruction de rendement «» la plus proche. La valeur peut être omise et elle renverra «indéfini». L'exécution de la fonction est interrompue et la valeur renvoyée est renvoyée à l'appelant du générateur.

Le résultat de next () est toujours un objet avec deux propriétés:

• Value: la valeur produite.
• Done: true si le le code de fonction est terminé sinon retournera faux.

Voyons ce que le même extrait de code renvoie lorsqu'il est appelé avec la méthode next ():

Dans l'image ci-dessus, la valeur et done sont renvoyés pour chaque mot-clé «yield» et «return». Avec la dernière instruction de fonction (le mot-clé return) passant de false à true pour indiquer qu'elle a atteint la dernière instruction d'une fonction, l'exécution de la fonction génératrice doit maintenant s'arrêter. Voici comment la fonction de générateur est appelée et les valeurs en sont extraites.

Générateur sans aucune instruction de retour:

La fonction de générateur arrêtera l'exécution sans avoir une instruction de retour dans la fonction. Voici à quoi ressemblera le code:

function * generateNumber () {

Dans l'extrait de code ci-dessus, nous n'avons renvoyé aucune valeur d'un générateur. Une fois que tout yield est résolu, et que nous appelons la méthode next (), elle retournera alors une valeur comme «indéfinie» et arrête l'exécution de l'instruction du générateur, et se termine avec la valeur «true».

Compatibilité du navigateur

Découvrez les autres méthodes disponibles pour les fonctions du générateur en plus de la méthode next (): [19659013] Return (): Renvoie la valeur donnée et termine l'exécution du générateur.

Les bases des générateurs

Avons-nous vraiment besoin de fonctions de générateur en JavaScript? Je pense qu'ils peuvent être utiles chaque fois que nous avons besoin de données uniquement à la demande et que nous ne voulons pas envoyer de données immédiatement lorsque nous exécutons une fonction. Il existe de nombreux autres cas d'utilisation où les fonctions du générateur sont utiles. Pour plus d'informations sur l'utilisation des fonctions du générateur contactez nos experts techniques aujourd'hui .

À propos de l'auteur

Akhilesh Ayyar est consultant technique senior chez Perficient Inc. Il est travaille actuellement en tant que développeur front-end avec l'équipe CAT. Il est un passionné de JavaScript et aime partager et entendre des expériences liées au développement Front-End.

Plus de cet auteur