- Overview
- Transcript
4.6 Iterators
Let’s learn about the iteration protocol and see how to iterate some of the data structures that we looked at earlier.
Syntax
next
1.Introduction2 lessons, 07:42
1.1Introduction02:12
1.2Setup05:30
2.Language Fundamentals8 lessons, 1:00:53
2.1Variables06:33
2.2Data Types11:28
2.3Arithmetic, Assignment, and Comparison Operators10:24
2.4Unary, Logical, Comma, and Spread Operators09:02
2.5Operator Precedence03:50
2.6Reserved Words04:17
2.7Strict Mode04:34
2.8Functions10:45
3.Data Structures5 lessons, 22:52
3.1Arrays04:29
3.2Objects04:30
3.3Sets04:57
3.4Maps04:21
3.5Weak Maps and Weak Sets04:35
4.Controlling Program Execution7 lessons, 37:06
4.1Conditionals07:49
4.2Switch Statements04:41
4.3The For Loop06:39
4.4The `for .. in` Loop05:17
4.5The `for .. of` Loop04:02
4.6Iterators05:03
4.7While Loops03:35
5.Using JavaScript13 lessons, 1:44:36
5.1Working With Strings09:32
5.2Template Literals05:46
5.3Working With Numbers06:57
5.4Working With Arrays12:53
5.5Iterating and Transforming Arrays07:33
5.6Working With the Object Type13:55
5.7Object Literal Extensions06:45
5.8Working With Object Instances06:45
5.9Getters and Setters05:00
5.10Custom Objects11:28
5.11The `Math` API04:54
5.12Working With Dates and Times08:10
5.13The `Array` Constructor04:58
6.Functions8 lessons, 56:07
6.1The `this` Object06:15
6.2Working With Functions10:11
6.3Scope07:37
6.4Arrow Functions06:59
6.5Generator Functions08:13
6.6Closures05:00
6.7Prototypes06:26
6.8Default and Rest Parameters05:26
7.Miscellaneous6 lessons, 52:39
7.1Destructuring Assignments08:09
7.2AJAX08:30
7.3Regular Expressions10:51
7.4More About Regular Expressions08:38
7.5Classes06:48
7.6ES Modules09:43
8.Working With the DOM6 lessons, 37:39
8.1Selecting HTML Elements05:02
8.2Manipulating HTML Elements07:40
8.3DOM Traversal05:25
8.4Adding and Removing Elements04:45
8.5Creating Elements and Other Nodes04:39
8.6DOM Events10:08
9.Web APIs4 lessons, 17:41
9.1The Selector API03:03
9.2Geolocation05:29
9.3Web Storage05:24
9.4Web Workers03:45
10.Asynchronous JavaScript5 lessons, 26:23
10.1Promises09:52
10.2Promise Chaining05:11
10.3The async Keyword03:21
10.4The await Keyword04:04
10.5More About async and await03:55
11.Conclusion1 lesson, 00:43
11.1Conclusion00:43
4.6 Iterators
Hi folks. In this lesson, we're going to look at iterables and iterators. We learned in the last lesson that the for overloop can be used to iterate any iterable. And we've across the term several times so far throughout the course. An array is a type of iterable. So is a string as well as a number of other objects like the special arguments objects inside functions and maps and sets. This is generally all we'll need to know about iterables. Although it is possible to override the default iterable behavior or iterable objects, and it's even possible to make uniterable objects. Like objects literals integral, but this is quite advanced and pretty uncommon at this point. So we won't worry about this today. An iterator is a special object that provides access to a collection of items one at a time in which keeps track of which items have been accessed. All iterators contain a next method. When the next method is invoked, an object is returned with two keys, value and done. Value will be whatever value the iterator returned from the collection. While done is a Boolean that equals true only when the iterator has finished iterating the collection. So let's take a look at some iterators. We looked at the set object in the last section and saw a few of its methods, like add and delete. Another of these sets methods is the entries method. And this method returns an iteration that we can use to iterate the set. Let's take a look. In this case, the set items variable now contains an iterator, because the entries method of the set returns an iterator. This iterator has a next method so we can invoke this method in other to pull out the first item from the set. Let's take a look in a browser now, and see what we get. So the value is an array and the done property equals false which means there are more items in the set. Now the reason why the set returns an array as the first item is so that sets and maps work in the same way. It was decided that iterators for both sets, and maps, should be aligned. In the case of a map, the array contains two items, both the key and the value. But with sets, there are no keys and so even though the value contains an array when used with a set like this, both of the items in the array are same and they both equal the value. So the done property is equal to false, and that means that we can still call the next method. So if we wanted, we could go back and add another log statement which called the next method once again. We can keep invoking the next method until done is equal to true. So the last time after we've already pulled out all three values from this set, the object that the next method returns contains undefined as the value, and this time the done property is set to true. So maps and sets both have methods that return iterators. Iterators are very similar to a loop except that, instead of the loop executing a set number of times depending on how many values there are in the thing that we're using the loop with. An iterator is like a manual loop, and it doesn't get executed automatically. We have control over when it gets executed, and that execution is controlled by us invoking the next method. There are many more methods in JavaScript. And there are many more objects that can return iterators, so you will come across them fairly regularly. So in this lesson we looked at iterators. An iterator is any object that exposes a next method. When this next method is invoked, an object is returned which contains the current value in the collection being iterated. And a boolean indicating whether there are more items in the collection. Iterators are just like loops, except that we control when each iteration of the loop takes place. In the next lesson, we'll look at one more type of loop available in JavaScript, the While loop, thanks for watching.