Uma introdução aos iteradores e geradores em JavaScript
Desde 2015, EcmaScript6 (ES6) trouxe muitos avanços nas práticas de codificação JavaScript. Vários conceitos modernos foram introduzidos no JavaScript, melhorando muito a experiência de codificação. Neste artigo, você aprenderá sobre iteradores e geradores em JavaScript.
Iteradores e geradores são dois conceitos diferentes, mas são usados de maneiras semelhantes. Eles são usados para iterar por meio de matrizes e objetos em JavaScript.
Iteradores
Os iteradores são como loops avançados que podem ser pausados. Os iteradores consistem na função next () , que retorna o valor e o status concluído. O campo de valor é o valor na matriz em um determinado índice. done é o valor booleano que retorna o status de conclusão da iteração por meio do loop.
Aqui está um exemplo que demonstra como os iteradores:
function fruitIter(fruits){
let index = 0;
return {
next: function(){
return index < fruits.length ? { value: fruits[index++], done: false } : {done: true}
}
}
}
const fruitsArray = ["Mango", "Banana", "Grapes"];
const fruits = fruitIter(fruitsArray);
console.log(fruits.next().value);
Produto :
Manga
Quando você passa o array fruitsArray no método fruitIter () , ele retorna um iterador armazenado na variável fruits . A variável de índice no método fruitIter () é inicializada em 0. Este método retorna a função next () que ajuda no loop através do array . A função next () verifica se o índice é menor que o comprimento de fruitsArray . Nesse caso, ele retorna duas variáveis: o nome da fruta nesse índice e o status de concluído . Ao retornar esses valores, ele também incrementa o valor do índice.
Para verificar como esse método funciona e imprimir o nome da fruta, você precisa chamar a função next () no iterador de frutas e obter acesso ao seu valor.
Geradores
Os geradores são semelhantes aos iteradores, mas retornam vários valores. Esses valores são chamados de valores de rendimento. As funções do gerador são escritas usando a sintaxe function * . * denota que não é uma função normal, mas um gerador. Aqui está um exemplo de geradores:
function* printFruits(){
yield "Mango";
yield "Banana";
yield "Grapes";
}
const fruit = printFruits();
console.log(fruit.next());
Produto :
{valor: 'Manga', feito: falso}Neste exemplo, o rendimento é o iterador. Quando você chama a função printFruits () e imprime fruit.next () , ele fornece um objeto de onde você obtém o valor. O status concluído denota se todos os valores foram iterados.
Aprenda estruturas de dados usando classes ES6 em JavaScript
JavaScript ES6 trouxe muitos avanços nas práticas de codificação. Não menos importante, é construir estruturas de dados usando classes ES6. Empurre. pop, e empilhe seu caminho até o topo e torne-se um profissional de JavaScript!
