Iterables and Iterators in JavaScript
0 likes102 views
The document explains iterables and iterators in JavaScript, highlighting how iterables expose data through the symbol.iterator method. It details the creation and functionality of iterators, including the next() method to traverse elements. The text also discusses the importance of choosing appropriate data structures for iteration and the challenges posed by various data types.
![Iterables, is a data structure that provides a way
to expose its data to the public.
This is done by implementing a method whose key is
Symbol.iterator, which is a factory for iterators.
// Variable ‘fruits’ has an Iterable list
const fruits = [' 🍎', ' 🍐', ' 🍊'];
Iterator, is a pointer for traversing the elements
of a data structure.
// Creating an Iterator ‘fruitIterator’
const fruitIterator = fruits[Symbol.iterator]();](https://image.slidesharecdn.com/rcg4xwuptkoakuoankes-signature-00be3ef6976aca2fe0243000cb81e09ca2151dfeb64e1b74056f5af57b125be9-poli-200616044814/85/Iterables-and-Iterators-in-JavaScript-2-320.jpg)
Iterables and Iterators in JavaScript
- 1. ITERABLES & ITERATORS in JAVASCRIPT JS NUGGETS
- 2. Iterables, is a data structure that provides a way to expose its data to the public. This is done by implementing a method whose key is Symbol.iterator, which is a factory for iterators. // Variable ‘fruits’ has an Iterable list const fruits = [' 🍎', ' 🍐', ' 🍊']; Iterator, is a pointer for traversing the elements of a data structure. // Creating an Iterator ‘fruitIterator’ const fruitIterator = fruits[Symbol.iterator]();
- 3. Iterator object has a next() method which returns the next item in the sequence. This method returns an object with two properties, done and value. When next() call reaches to the end of sequence then the done property set to true else remain false. fruitIterator.next(); // {value: " 🍎", done: false} fruitIterator.next(); // {value: " 🍐", done: false} fruitIterator.next(); // {value: " 🍊", done: false} // Returns done as true when there is no element to return fruitIterator.next(); // {value: undefined, done: true}
- 4. Without iterable, it is really difficult to manage the iteration on data for various types of data structures. For instance, iteration on an Array is different from iteration on an Object. And now with the introduction of new data structures like Sets and Maps in ES6, it is really going to be more complicated. Two things to look for while using iterables, Data consumer - How the iteration takes place. (Loops, Spread operator, Array.from method, Destructuring via an array pattern, etc.) Data source - What data structure we choose. (Array, Objects, Set, Maps, etc.) But, do we really need an iterable?