Iterators και Iterables JavaScript

Σε αυτό το σεμινάριο, θα μάθετε για iterators JavaScript και iterables με τη βοήθεια παραδειγμάτων.

Iterables και Iterators JavaScript

Το JavaScript παρέχει ένα πρωτόκολλο για επανάληψη δομών δεδομένων. Αυτό το πρωτόκολλο καθορίζει πώς αυτές οι δομές δεδομένων επαναλαμβάνονται κατά τη χρήση του for… ofβρόχου.

Η έννοια του πρωτοκόλλου μπορεί να χωριστεί σε:

  • επαναληπτικό
  • επαναληπτικό

Το επαναληπτικό πρωτόκολλο αναφέρει ότι ένα επαναληπτικό πρέπει να έχει το Symbol.iteratorκλειδί.

Iterables JavaScript

Οι δομές δεδομένων που έχουν τη Symbol.iterator()μέθοδο ονομάζονται iterables. Για παράδειγμα, πίνακες, χορδές, σύνολα κ.λπ.

Επαναληπτές JavaScript

Ο επαναληπτής είναι ένα αντικείμενο που επιστρέφεται με τη Symbol.iterator()μέθοδο.

Το πρωτόκολλο επανάληψης παρέχει τη next()μέθοδο πρόσβασης σε κάθε στοιχείο της επαναληπτικής (δομή δεδομένων) ένα κάθε φορά.

Ας δούμε ένα παράδειγμα με επαναλαμβανόμενα 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);

Παραγωγή

 Array Iterator () StringIterator ()

Εδώ, η κλήση της Symbol.iterator()μεθόδου τόσο του πίνακα όσο και της συμβολοσειράς επιστρέφει τους αντίστοιχους επαναληπτές τους.

Επανάληψη μέσω Iterables

Μπορείτε να χρησιμοποιήσετε τον for… ofβρόχο για να επαναλάβετε αυτά τα επαναλαμβανόμενα αντικείμενα. Μπορείτε να επαναλάβετε τη Symbol.iterator()μέθοδο όπως αυτή:

 const number = ( 1, 2, 3); for (let n of number(Symbol.iterator)()) ( console.log(n); )

Παραγωγή

 1 2 3

Ή μπορείτε απλά να επαναλάβετε τον πίνακα όπως αυτό:

 const number = ( 1, 2, 3); for (let n of number) ( console.log(n); )

Εδώ, ο επαναληπτής επιτρέπει στον for… ofβρόχο να επαναλαμβάνει μια συστοιχία και να επιστρέφει κάθε τιμή.

Επόμενη JavaScript () Μέθοδος

Το αντικείμενο iterator έχει μια next()μέθοδο που επιστρέφει το επόμενο στοιχείο στην ακολουθία.

Η next()μέθοδος περιέχει δύο ιδιότητες: valueκαι done.

  • τιμή
    Η valueιδιότητα μπορεί να είναι οποιουδήποτε τύπου δεδομένων και αντιπροσωπεύει την τρέχουσα τιμή στην ακολουθία.
  • ολοκληρωμένη
    Η doneιδιότητα είναι μια δυαδική τιμή που δείχνει εάν η επανάληψη είναι πλήρης ή όχι. Εάν η επανάληψη δεν είναι πλήρης, η doneιδιότητα έχει οριστεί false, αλλιώς έχει οριστεί σε true.

Ας δούμε ένα παράδειγμα επαναληπτικών πινάκων:

 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)

Μπορείτε να καλέσετε next()επανειλημμένα για να επαναλάβετε ένα arrIteratorαντικείμενο.

  • Η next()μέθοδος επιστρέφει ένα αντικείμενο με δύο ιδιότητες: valueκαι done.
  • Όταν η next()μέθοδος φτάσει στο τέλος της ακολουθίας, τότε η doneιδιότητα έχει οριστεί σε false.

Ας δούμε πώς ο for… ofβρόχος εκτελεί το παραπάνω πρόγραμμα. Για παράδειγμα,

 const arr = ('h', 'e', 'l', 'l', 'o'); for (let i of arr) ( console.log(i); )

Παραγωγή

 Χαίρετε

Ο for… ofβρόχος κάνει ακριβώς το ίδιο με το παραπάνω πρόγραμμα.

Ο for… ofβρόχος συνεχίζει να καλεί τη next()μέθοδο στον επαναληπτικό. Μόλις φτάσει done:true, ο for… ofβρόχος τελειώνει.

Iterator που καθορίζεται από το χρήστη

Μπορείτε επίσης να δημιουργήσετε τον δικό σας επαναληπτικό και κλήση next()για πρόσβαση στο επόμενο στοιχείο. Για παράδειγμα,

 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());

Παραγωγή

 (τιμή: "h", ολοκληρωμένο: false) (τιμή: "e", ολοκληρωμένο: false) (τιμή: "l", ολοκληρωμένο: false) (τιμή: "l", ολοκληρωμένο: false) (τιμή: "o" , done: false) (τιμή: μη καθορισμένη, ολοκληρωμένη: true)

Στο παραπάνω πρόγραμμα, δημιουργήσαμε τον δικό μας επαναληπτικό. Η displayElements()συνάρτηση επιστρέφει valueκαι doneιδιότητα.

  • Κάθε φορά next()που καλείται η μέθοδος, η συνάρτηση εκτελείται μία φορά και εμφανίζει την τιμή ενός πίνακα.
  • Τέλος, όταν όλα τα στοιχεία ενός πίνακα έχουν εξαντληθεί, η doneιδιότητα ρυθμίζεται σε true, valueως undefined.

ενδιαφέροντα άρθρα...