Pythoniser JavaScript

Python possède de nombreuses fonctions utilitaires puissantes telles que range, enumerate, zip, etc., qui sont construites sur des objets itérables et le protocole itérateur. Combinés avec des fonctions de générateur, ces protocoles sont disponibles dans tous les navigateurs Evergreen et Node.js depuis 2016 environ, mais leur utilisation est étonnamment faible, à mon avis. Dans cet article, je vais implémenter certaines de ces fonctions d'assistance à l'aide de TypeScript dans l'espoir de changer cela.

Itérateurs, itérables et fonctions génératrices

Protocole itérateur

Le protocole itérateur est un moyen standard de générer une séquence de valeurs. Pour qu'un objet soit un itérateur, il doit adhérer au protocole de l'itérateur en implémentant la méthode next, par exemple :

const iterator = {
  i: 0,
  next() {
    return { done: false, value: this.i++ };
  }
};

On peut alors appeler la méthode next à plusieurs reprises pour obtenir la valeur :

console.log(iterator.next().value); // → 0
console.log(iterator.next().value); // → 1
console.log(iterator.next().value); // → 2
console.log(iterator.next().value); // → 3
console.log(iterator.next().value); // → 4

La méthode

next doit renvoyer un objet contenant une propriété value (contenant la valeur réelle) et une propriété done (spécifiant si l'itérateur est épuisé, c'est-à-dire s'il ne peut plus produire de valeurs). Selon MDN, aucun des deux attributs n'est strictement requis et si les deux sont manquants, la valeur de retour est traitée comme { done: false, value: undefined }.

Protocole objet itérable

Le protocole Iterable Object permet à un objet de définir son propre comportement d'itération. Pour adhérer au protocole Iterable Object, un objet doit définir une méthode à l'aide de la clé Symbol.iterator qui renvoie un itérateur. De nombreux objets intégrés tels que Array, TypedArray, Set et Map implémentent ce protocole afin qu'ils puissent être itérés à l'aide d'une boucle for...of.

Par exemple, pour un tableau, la méthode values est spécifiée comme méthode Symbol.iterator du tableau :

console.log(Array.prototype.values === Array.prototype[Symbol.iterator]); // → true

Nous pouvons combiner les protocoles itérateur et objet itérable pour créer un itérateur itérable comme suit :

const iterable = {
  i: 0,
  [Symbol.iterator]() {
    const iterable = this;
    return {
      next() {
        return { done: false, value: iterable.i++ };
      }
    };
  }
};

Les noms de ces deux protocoles sont malheureusement très similaires et me confondent encore aujourd'hui.

Comme vous l'avez peut-être deviné, nos exemples d'itérateurs et d'objets itérables sont infinis, ce qui signifie qu'ils peuvent générer des valeurs pour toujours. Il s’agit d’une fonctionnalité très puissante, mais elle peut aussi facilement devenir un piège. Par exemple, si nous devions utiliser un itérable dans une boucle for...of, la boucle continuerait indéfiniment ou comme paramètre d'un Array.from, JS finirait par lancer un RangeError car le tableau deviendrait trop grand :

// 将无限循环：
for (const value of iterable) {
  console.log(value);
}

// 将抛出 RangeError
const arr = Array.from(iterable);

La raison pour laquelle les itérateurs et les itérables peuvent même devenir infinis est qu'ils sont évalués paresseusement, c'est-à-dire qu'ils ne produisent une valeur que lorsqu'ils sont utilisés.

Fonction générateur

Bien que les itérateurs et les objets itérables soient des outils précieux, ils peuvent être un peu lourds à écrire. Comme alternative, des fonctions de générateur ont été introduites.

Les fonctions du générateur sont spécifiées à l'aide de function* (ou function *, l'astérisque peut être n'importe où entre le mot-clé function et le nom de la fonction), nous permettant d'interrompre l'exécution de la fonction et de renvoyer une valeur à l'aide du yield mot-clé , et reprendre l'exécution là où elle s'est arrêtée plus tard, tout en conservant son état interne :

const iterator = {
  i: 0,
  next() {
    return { done: false, value: this.i++ };
  }
};

Utilitaires Python

Comme mentionné dans l'introduction, Python possède des utilitaires intégrés très utiles basés sur le protocole ci-dessus. JavaScript a également récemment ajouté des méthodes d'assistance pour les itérateurs, telles que .drop() et .filter(), mais (peut-être pas encore) possède certains des utilitaires les plus intéressants de Python.

Mettons-nous à l’action !

Maintenant que la partie théorique est terminée, commençons à implémenter quelques fonctions Python !

Remarque : Aucune de ces implémentations présentées ici ne doit être utilisée telle quelle dans des environnements de production. Ils manquent de gestion des erreurs et de vérification des conditions aux limites.

énumérer(itérable [,start])

enumerate en Python renvoie une séquence de tuples pour chaque élément dans une séquence d'entrée ou itérable, où la première position contient le nombre et la deuxième position contient l'élément :

console.log(iterator.next().value); // → 0
console.log(iterator.next().value); // → 1
console.log(iterator.next().value); // → 2
console.log(iterator.next().value); // → 3
console.log(iterator.next().value); // → 4

enumerate accepte également un paramètre facultatif start indiquant où doit commencer le compteur :

console.log(Array.prototype.values === Array.prototype[Symbol.iterator]); // → true

Implémentons cela dans TypeScript à l'aide de fonctions génératrices. Nous pouvons utiliser l'implémentation décrite dans la documentation Python comme guide

const iterable = {
  i: 0,
  [Symbol.iterator]() {
    const iterable = this;
    return {
      next() {
        return { done: false, value: iterable.i++ };
      }
    };
  }
};

Puisque les chaînes en JavaScript implémentent le protocole Iterable Object, nous pouvons simplement transmettre la chaîne à notre fonction enumerate et l'appeler comme ceci :

// 将无限循环：
for (const value of iterable) {
  console.log(value);
}

// 将抛出 RangeError
const arr = Array.from(iterable);

répéter(elem [,n])

repeat fait partie de la bibliothèque itertools intégrée, qui répète l'entrée donnée elem n fois, ou à l'infini si n n'est pas spécifié. Encore une fois, nous pouvons utiliser l'implémentation dans la documentation Python comme point de départ.

function* sequence() {
  let i = 0;
  while (true) {
    yield i++;
  }
}

const seq = sequence();
console.log(seq.next().value); // → 0;
console.log(seq.next().value); // → 1;
console.log(seq.next().value); // → 2;

// 将无限循环，从 3 开始
for (const value of seq) {
  console.log(value);
}

(L'implémentation des fonctions cycle et range est omise ici car trop longue, mais la logique est la même que le texte original, seul le code est réécrit en TypeScript)

Conclusion

Ceci est mon premier article de blog, j'espère qu'il vous intéressera et que vous utiliserez peut-être des itérateurs, des itérables et des générateurs dans de futurs projets. Si vous avez des questions ou avez besoin de précisions, laissez un commentaire et je me ferai un plaisir de vous fournir plus d'informations.

Une chose à noter est que la performance est loin d'être proche de la for boucle originale utilisant un compteur. Cela n’a peut-être pas d’importance dans de nombreux cas, mais cela compte certainement dans les scénarios de hautes performances. Cela me dérange de constater que des images sont perdues lorsque je dessine des données PCM sur un canevas et que j'utilise des itérateurs et des générateurs. C'est peut-être évident avec le recul, mais ça ne l'était pas pour moi à l'époque :D

Bravo !

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!