I den här handledningen lär du dig om JavaScript-iteratorer och iterables med hjälp av exempel.
JavaScript Iterables och Iterators
JavaScript ger ett protokoll för att iterera över datastrukturer. Detta protokoll definierar hur dessa datastrukturer itereras över med hjälp av for… of
slingan.
Konceptet för protokollet kan delas upp i:
- iterabel
- iterator
Iterabelprotokollet nämner att en iterabel ska ha Symbol.iterator
nyckeln.
Justeringar av JavaScript
Datastrukturerna som har Symbol.iterator()
metoden kallas iterables. Till exempel Arrays, Strings, Sets, etc.
JavaScript Iteratorer
En iterator är ett objekt som returneras med Symbol.iterator()
metoden.
Iteratorprotokollet tillhandahåller next()
metoden för åtkomst till varje element i iterabeln (datastruktur) en i taget.
Låt oss titta på ett exempel på iterables som har Symbol.Iterator()
const arr = (1, 2 ,3); // calling the Symbol.iterator() method const arrIterator = arr(Symbol.iterator)(); // gives Array Iterator console.log(arrIterator); const str = 'hello'; // calling the Symbol.iterator() method const strIterator = str(Symbol.iterator)(); // gives String Iterator console.log(strIterator);
Produktion
Array Iterator () StringIterator ()
Här återkallar Symbol.iterator()
metoden för både matrisen och strängen sina respektive iteratorer.
Iterera genom Iterables
Du kan använda for… of
slingan för att itera igenom dessa iterabla objekt. Du kan itera igenom Symbol.iterator()
metoden så här:
const number = ( 1, 2, 3); for (let n of number(Symbol.iterator)()) ( console.log(n); )
Produktion
1 2 3
Eller så kan du helt enkelt itera genom matrisen så här:
const number = ( 1, 2, 3); for (let n of number) ( console.log(n); )
Här tillåter iteratorn for… of
slingan att iterera över en matris och returnera varje värde.
JavaScript nästa () Metod
Iteratorobjektet har en next()
metod som returnerar nästa objekt i sekvensen.
Den next()
metod innehåller två egenskaper: value
och done
.
- värde
Denvalue
egenskapen kan vara av vilken typ av data och representerar det aktuella värdet i sekvensen. - gjort
idone
fastigheten är ett booleskt värde som anger om iterationen är klar eller inte. Om iterationen är ofullständig ärdone
egenskapen inställd påfalse
, annars är den inställd påtrue
.
Låt oss titta på ett exempel på array-iterables:
const arr = ('h', 'e', 'l', 'l', 'o'); let arrIterator = arr(Symbol.iterator)(); console.log(arrIterator.next()); // (value: "h", done: false) console.log(arrIterator.next()); // (value: "e", done: false) console.log(arrIterator.next()); // (value: "l", done: false) console.log(arrIterator.next()); // (value: "l", done: false) console.log(arrIterator.next()); // (value: "o", done: false) console.log(arrIterator.next()); // (value: undefined, done: true)
Du kan ringa next()
upprepade gånger för att itera över ett arrIterator
objekt.
- Den
next()
metoden returnerar ett objekt med två egenskaper:value
ochdone
. - När
next()
metoden når slutet av sekvensen ärdone
egenskapen inställd påfalse
.
Låt oss titta på hur for… of
loop kör programmet ovan. Till exempel,
const arr = ('h', 'e', 'l', 'l', 'o'); for (let i of arr) ( console.log(i); )
Produktion
Hej
Den for… of
slinga gör exakt samma som programmet ovan.
Den for… of
slingan håller ringa next()
metoden på iterator. När den når done:true
den for… of
avslutar slingan.
Användardefinierad Iterator
Du kan också skapa din egen iterator och ringa för next()
att komma åt nästa element. Till exempel,
function displayElements(arr) ( // to update the iteration let n = 0; return ( // implementing the next() function next() ( if(n < arr.length) ( return ( value: arr(n++), done: false ) ) return ( value: undefined, done: true ) ) ) ) const arr = ('h', 'e', 'l', 'l', 'o'); const arrIterator = displayElements(arr); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next());
Produktion
(värde: "h", gjort: falskt) (värde: "e", gjort: falskt) (värde: "l", gjort: falskt) (värde: "l", gjort: falskt) (värde: "o" , gjort: falskt) (värde: odefinierat, gjort: sant)
I ovanstående program har vi skapat en egen iterator. De displayElements()
funktionen returnerar value
och done
egendom.
- Varje gång
next()
metoden anropas körs funktionen en gång och visar värdet på en matris. - Slutligen, när alla element i en matris är förbrukade, är
done
egenskapen inställd påtrue
, medvalue
somundefined
.