Iteratori asincroni contro generatori asincroni in JavaScript
In JavaScript, Iteratori asincroni E Generatori asincroni Offri la stessa funzionalità che potrebbe essere effettivamente implementata usando i primitivi del linguaggio JavaScript. Quindi, perché non scegliere una soluzione semplice piuttosto che metterti in un'altra confusione?
Questo post discute iteratrini asincroni contro i generatori asincroni in JavaScript insieme a esempi adeguati. Quindi iniziamo!
Iteratori in JavaScript
In JavaScript, "Iteratori"Vengono utilizzati per accedere a strutture di dati sincroni come array, mappe e set. Sono principalmente basati su "Prossimo()"Metodo, che comprende due proprietà:"Prossimo" E "valore":
- IL "valore"Proprietà del Prossimo() Il metodo indica il valore corrente nella sequenza di iterazione.
- IL "Fatto"Proprietà del Prossimo() Il metodo rappresenta lo stato di iterazione, dove "falso"Indica che il processo di iterazione è completato e"VERO"Significa che l'iterazione è incompleta.
Ora controlleremo il funzionamento degli iteratori in JavaScript con l'aiuto di un esempio.
Esempio: usare iteratori in JavaScript
Creeremo un "numeri"Oggetto con due proprietà:"inizio" E "FINE". Quindi, aggiungeremo un "capacità di iterazione" al "numeri"Oggetto utilizzando il"Simbolo.iteratore ()" metodo.
IL "Simbolo.iteratore ()"Il metodo verrà invocato una volta, all'inizio del"per ... di"Loop e restituisce un oggetto iterabile. Dopo aver eseguito questa operazione, il "per ... di"Loop accederà all'oggetto iterabile e prenderà i valori nella sequenza di iterazione:
let numeri =Inizio: 1,
fine: 4,
[Simbolo.iterator] ()
ritorno
Currente: questo.inizio,
Ultimo: questo.FINE,
Prossimo()
se questo.attuale <= this.last)
return done: false, valore: questo.corrente ++;
altro
return done: true;
;
;
Il sopra dato, "Prossimo()"Il metodo verrà invocato e restituirà il"valore"Come oggetto:
for (let value of numeras)avviso (valore);
Scrivi il codice fornito nella finestra della console ed eseguilo:
Abbiamo iterato con successo su ogni elemento del "numeri"Oggetto che può essere visto nella seguente GIF:
Come accennato in precedenza, i regolari iteratori JavaScript possono aiutarti a iterare sui dati sincroni. E se i valori diventino asincroni a causa di qualsiasi ritardo? In tale scenario, è necessario implementare il Iteratori asincroni In JavaScript.
Iteratori asincroni in JavaScript
Gli iteratori asincroni sono incorporati in ES9 per gestire le fonti di dati asincrone. Funziona in modo simile al normale iteratore tranne che il "Prossimo()"Metodo in un iteratore asincrono restituisce un"Promettere"Che risolve il"valore" E "Fatto"Valori delle proprietà di un oggetto.
Converti l'iteratore regolare in iteratore asincrono in JavaScript
Se si desidera convertire un normale iteratore in un iteratore asincrono, segui le istruzioni di seguito:
- Invece di usare il "Simbolo.Iteratore ()"Metodo, utilizza"Simbolo.Asinciterator ()".
- Forzare il "Prossimo()"Metodo per restituire un file Promettere e aggiungi un "asincrone"Parola chiave con esso come:"Async next ()".
- Infine, il "per attendere ... di"Il ciclo può essere usato per iterare su un oggetto, anziché"per ... di" ciclo continuo.
Esempio: iteratori asincroni in Javascript
Ora convertiremo il normale iteratore definito nell'esempio precedente in iteratori asincroni seguendo le regole specificate.
A tale scopo, sostituiremo il "Simbolo.Iteratore ()" con il "Simbolo.Asinciterator ()" metodo. Quindi, aggiungeremo la parola chiave "asincrone" prima di "Prossimo()" metodo. Usando "Aspetta" nel "Prossimo()"Il metodo imposterà il tempo per mantenere la promessa dopo"2"Secondi:
let numeri =Inizio: 1,
fine: 4,
[Simbolo.asynciterator] ()
ritorno
Currente: questo.inizio,
Ultimo: questo.FINE,
Async next ()
waitNewPromise (resolve => setTimeout (Resolve, 2000));
se questo.attuale <= this.last)
return done: false, valore: questo.corrente ++;
altro
return done: true;
;
;
Per iterazione su un oggetto iterabile asincrono, "per attendere ... di"Il ciclo verrà utilizzato nel modo seguente:
(async () =>per attesa (let valore dei numeri)
Avviso (valore);
) ()
L'output visualizzerà i valori iterati nella casella di avviso dopo un ritardo di due secondi:
A questo punto, hai capito il funzionamento di iteratori asincroni. Ora andremo avanti e impareremo Generatori asincroni In JavaScript.
Generatori in javascript
Gli iteratori in JavaScript sono abbastanza utili; Tuttavia, hanno bisogno di un'attenta programmazione per eseguire la loro funzionalità prevista. IL Funzione del generatore JavaScript è un altro strumento potente che ti consente di definire un algoritmo iterativo con l'aiuto di un singolo "non continuo" funzione.
Inizialmente, una funzione del generatore non esegue il suo codice quando viene invocata; Invece, restituisce un tipo specifico di iteratore noto come "Generatore". La funzione del generatore può essere invocata tutte le volte necessarie e su ogni chiamata, restituisce un nuovo "Generatore,"Che può essere iterato una volta.
Per scrivere la funzione del generatore, il "funzione*"Viene utilizzata la sintassi. Questa funzione comprende anche un "prodotto"Operatore che mette in pausa l'esecuzione della funzione del generatore fino a quando non viene richiesto il valore successivo di un oggetto.
Esempio: usando i generatori in javascript
Definiremo un “Generatore"Funzione che restituisce i valori da"punto di partenza" A "Endingpoint" usando il "prodotto"Operatore. IL "*"Aggiunto con il"funzione"La parola chiave indica che"Generatore()"È una funzione del generatore, non una normale funzione normale.
funzione* generator (inizialePpoint, endingpoint)per (let i = parte di partenza; i<= endingPoint; i++)
resa i;
Nel prossimo passaggio, invoceremo il "Generatore()"Funzione che restituisce un generatore memorizzato nel"X"Oggetto:
let x = generatore (1, 5);Infine, per iterare il "X"Generatore, useremo il"per ... di" ciclo continuo:
per (const num of x)console.log (num);
L'esecuzione del programma fornito mostrerà i valori iterati:
Se vuoi recuperare i risultati basati sulla promessa dal "Generatore", Devi usare"Generatore asincrono"Nel programma JavaScript.
Generatori asincroni in javascript
Generatore asincrono In JavaScript funziona in modo simile alla funzione del generatore tranne che il "Prossimo()"Metodo nel generatore asincrono restituisce un"Promettere"Che risolve il"valore" E "Fatto"Valori delle proprietà di un oggetto.
Converti la funzione del generatore in iteratore asincrono in JavaScript
Seguire le istruzioni di seguito per convertire una funzione generatore in un iteratore asincrono in JavaScript:
- Utilizzo "asincrone" prima di "funzione*" parola chiave.
- Invece di un "valore","prodotto"Dovrebbe restituire un"Promettere".
Ora ti mostreremo la procedura pratica per la conversione di una funzione del generatore in generatori asincroni in JavaScript.
Esempio: generatori asincroni in JavaScript
Prima di tutto, aggiungeremo il "asincrone"Parola chiave prima di definire il"asincrequenza ()"Funzione asincrona. L'asincesave () produce un “Promettere"Che sarà soddisfatto in un secondo:
AsyncFunction* Async Sequence (iniziale, EndingPoint)per (let i = inizialePpoint; i
setTimeout (() =>
risolvere (i);
, 1000);
);
Da ultimo, "per attendere ... di"Loop viene utilizzato per iterare e restituire il generatore asincrono:
(async () =>Sia x = asincesta (1, 5);
per attesa (let num of x)
console.log (num);
) ();
Questo programma JavaScript restituirà i valori da "1" A "5"Mentre si prende un divario di"uno"Secondo:
Abbiamo fornito le informazioni essenziali relative a Iteratori asincroni E Generatori asincroni. Entrambi possono essere usati per iterarsi su dati asincroni in JavaScript; Può essere difficile per i principianti mantenere la logica interna o la definizione degli iteratori asincroni, mentre i generatori asincroni offrono un altro efficiente E meno soggetto a errori modo di utilizzare iteratori. Nasconde anche il complessità di iteratore e rende il codice conciso e leggibile.
Quindi, ti consigliamo Usa generatori asincroni Per gestire le iterazioni relative alla raccolta di dati asincrona.
Conclusione
Iteratore asincronosabbia Generatori asincroni vengono utilizzati per iterare i dati, forniti dopo un certo periodo di tempo. Gli iteratori asincroni eseguono il "Simbolo.Asinciterator ()Metodo "per restituire un"iteratore", Mentre i generatori asincroni restituiscono un tipo speciale di iteratore"Generatore"Da solo, che può essere utilizzato ovunque sia richiesta l'iterazione. Questo articolo ha discusso di iteratori asincroni e generatori asincroni in JavaScript.