Geradores em JavaScript | Explicado com exemplos
JavaScript geralmente apresenta soluções para vários problemas, especialmente com a chegada da versão ES6 do JavaScript. Um dos principais recursos introduzidos no ES6 foram os geradores, os geradores em JavaScript são usados com iteradores para criar um fluxo de dados ou um fluxo de dados. Os geradores nos ajudam a evitar problemas de função de retorno de chamada.
O que realmente são geradores
Em palavras simples, os geradores são funções especiais; Ao contrário das funções normais que têm apenas uma declaração de retorno, os geradores retornam vários valores, mas em momentos diferentes.
Para ser mais descritivo, os geradores são funções que retornam o valor no meio da função e depois param de executar depois de salvar o estado, esta etapa de retornar um valor, salvar o estado e interromper a execução é chamada produzindo um valor e uma pausa.
Durante essa pausa, o programa pode funcionar em alguma outra funcionalidade e, quando forem necessários, o gerador é solicitado a retornar o próximo valor, mas, em vez de reiniciar toda a função, o gerador é executado a partir do ponto em que parou e produz o Próximo valor. Assim, criando um fluxo constante de dados. É por isso que essas funções são chamadas de "geradores", pois são usadas para gerar o fluxo de dados.
Podemos olhar para os seguintes diagramas de trabalho para entender melhor a diferença entre as funções normais e gerador:
E a função do gerador funciona assim:
Como definir uma função de gerador?
Como as funções do gerador são funções especiais, é por isso que usamos uma palavra -chave especial enquanto definimos que é "função*" - asterisco após a palavra -chave da função. A sintaxe é como:
função* functionName (params)// corpo da função
valor de rendimento;
'
Observação:
- Função*: palavra -chave para definir funções do gerador
- FunctionName: o identificador para esta função
- Parâmetros: parâmetros opcionais que você deseja usar
- Rendimento: retorna o valor e interrompe a execução da função
Valor de retorno: Objeto [gerador] - Um objeto gerador OU indefinido se o gerador estiver vazio
Agora estamos familiarizados com o que é uma função de gerador, mas ainda não estamos familiarizados com seu tipo de retorno que é o "objeto gerador".
O que é um objeto de gerador?
Quando uma função de gerador é criada, ele retorna um objeto que devemos inicializar em alguma variável, essa variável é então conhecida como objeto gerador. Este objeto gerador é usado para obter o próximo valor da função.
Sintaxe de inicializar um objeto de gerador
variável = generatorFunctionName (argumentos);Depois de criar o objeto gerador, você pode usar a função “objeto.próximo()"
O objeto.próximo() Retorna um objeto JSON com duas propriedades, um é o "valor" e o outro é o "feito" propriedade.
Obtendo valores de uma função de gerador
Vamos criar uma função simples do gerador que nos retorne um novo valor toda vez que for chamado, com as seguintes linhas de código:
gerador de funções()rendimento 1;
rendimento "encontrado";
rendimento 3;
Agora que temos um gerador, precisamos inicializá -lo com um objeto gerador, fazemos isso com a seguinte declaração:
const genObject = generator ();Agora temos o objeto do gerador também. Tudo o que precisamos fazer agora é ligar para o próximo() função do objeto gerador e imprima o objeto JSON com o console.registro() função.
console.log (GenObject.próximo());console.log (GenObject.próximo());
console.log (GenObject.próximo());
O trecho de código completo se parece com o seguinte:
gerador de funções()rendimento 1;
rendimento "encontrado";
rendimento 3;
const genObject = generator ();
console.log (GenObject.próximo());
console.log (GenObject.próximo());
console.log (GenObject.próximo());
Temos a seguinte saída:
Como você pode ver, imprimimos 3 objetos JSON diferentes com 3 chamadas diferentes para a mesma função do gerador. Mas, às vezes, queremos usar o valor, não o objeto JSON. Podemos fazer isso acessando o valor Propriedade do objeto JSON com a seguinte linha de código:
console.log (GenObject.próximo().valor);console.log (GenObject.próximo().valor);
console.log (GenObject.próximo().valor);
Com essas linhas, obtemos a seguinte saída:
Como você pode ver, o objeto.próximo().valor Retorna -nos um valor que podemos até passar para outra função.
Trabalho da função do gerador na execução simultânea de código
Para este tutorial, vamos criar uma função simples do gerador que produza números de 1 a 5 e, após cada número que buscamos do gerador, nosso programa nos alertará de que está fazendo alguns cálculos sobre esse número e deixou a função do gerador.
A primeira etapa é criar uma função de gerador que produza 5 números diferentes em 5 chamadas diferentes com as seguintes linhas de código:
gerador de funções()console.log ("função geradora inicializada");
para (vamos i = 1; i <= 5; i++)
console.log ("Gerador interno para novo rendimento");
rendimento i;
Como você pode ver, criamos um loop que retornará 1 novo número inteiro em todas as chamadas de rendimento do gerador e nos solicitará sempre que o programa estiver dentro da função do gerador.
Agora, precisamos inicializar esta função do gerador com o objeto gerador com a seguinte linha de código.
const genObject = generator ();Agora, precisamos de uma função que faça algum trabalho nos valores rendidos, crie a função usando as seguintes linhas:
function tableprinter (num)console.log ('atualmente imprimindo a tabela de:' + num);
Temos uma função de gerador, um objeto gerador e uma função que funcionará em alguns valores que são passados dentro dele. Agora, tudo o que precisamos é de um iterador que iterará através do objeto gerador e passará os valores para a função. Fazemos isso usando as seguintes linhas de código:
rendededValue = GenObject.próximo().valor;while (rendedValue)
TablePrinter (rendimento de valor);
rendededValue = GenObject.próximo().valor;
O que este código fará é que ele aceitará o próximo valor do gerador e o armazenará dentro de uma variável. Então, no while loop, ele verificará se a variável é indefinida ou não, e se não for indefinida, ele passará esse valor para a função “TablePrinter ” e passe para o próximo valor.
O trecho de código completo é como:
gerador de funções()console.log ("função geradora inicializada");
para (vamos i = 1; i <= 5; i++)
console.log ("Gerador interno para novo rendimento");
rendimento i;
const genObject = generator ();
function tableprinter (num)
console.log ('atualmente imprimindo a tabela de:' + num);
rendededValue = GenObject.próximo().valor;
while (rendedValue)
TablePrinter (rendimento de valor);
rendededValue = GenObject.próximo().valor;
A saída do código a seguir é:
Como você pode ver, o programa entra na função do gerador e produz um novo valor, salva estados, faz pausa a execução da função, entra no “TablePrinter ” função e executa a execução lá. Uma vez feito, ele volta para dentro da função do gerador para um novo rendimento. Todo esse processo é repetido até que o gerador continue produzindo novos rendimentos. Assim, tornando -o um fluxo de dados.
É isso para geradores em javascript.
Conclusão
Os geradores são funções especiais que podem interromper sua execução no meio do caminho para produzir um valor, salvar seu estado e permitir que o programa execute outras tarefas. Quando necessário, a função do gerador “resumos ” sua execução do estado em que eles pararam. Os geradores são usados para gerar um fluxo constante de dados. Eles são usados em colaboração com promessas e iteradores para criar um fluxo infinito de dados e evitar problemas de função de retorno de chamada.