Shulou(Shulou.com)06/01 Report--

This article is about how to use the Javascript iterator. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

In JavaScript, an iterator is a design pattern for traversing container objects, that is, getting the data in turn. The iterator in js has a next () method that returns an object for each call, and the syntax is "next:function () {return {value,done}}".

The operating environment of this tutorial: windows10 system, javascript1.8.5 version, Dell G3 computer.

The usage of Javascript iterator

Iterator is a design pattern that traverses container objects such as linked lists and arrays without paying attention to the implementation details of the memory allocation of container objects. The simple understanding is that you can get the data one by one, similar to a moving pointer, but will tell us when it ends. So we can get the data and do what we need to do.

What does the iterator in js look like

In javascript, an iterator is a special object that has a next () method that returns an object (the result object) for each call. The result object has two properties: one is value, which represents the next value to be returned, and the other is done, which is a Boolean value that is true if it has been iterated to the last value in the sequence. The iterator also holds an internal pointer to the location of the values in the current collection, and each time the next () method is called, it returns the next available value, similar to the structure of the following object.

{next: function () {return {value:'', done: true / false} iterative protocol

With the further improvement of the ability of javascript language, some new data types such as Map, Set, WeakMap and so on have been added. For these different data structures, it can be iterated uniformly. Es6 has added iterative protocol.

An iterative protocol is not a new built-in implementation or syntax, but a protocol. These protocols can be implemented by any object that follows certain conventions.

The iterative protocol is divided into two protocols: the iterable protocol and the iterator protocol.

The simple understanding is that any object in js can traverse as long as it satisfies the iterative protocol.

Iterable protocol

To become an iterable object, an object must implement the @ @ iterator method. This means that an object (or an object on its prototype chain) must have a property with the key @ @ iterator, which can be accessed through the constant Symbol.iterator:

To put it simply, if you want something to traverse, it has to have an @ @ iterator, which can be accessed through Symbol.iterator.

Iterator protocol

The iterator protocol defines a standard way to produce a series of values, whether finite or infinite. When the value is limited and all values are iterated, a default return value is returned.

An object conforms to the iterator protocol only if a next () method with the following semantic is implemented:

Iterative process

When an object needs to be iterated (such as when it is written into a for...of loop), first, its @ @ iterator method is called without arguments (in this case, the structure is returned {next: function () {}}), and then the iterator returned by this method is used to get the value to be iterated (in fact, the next () method is called repeatedly)

Iterative summary

The iterative protocol can be summarized as follows: in order to traverse something, it must satisfy the iterable protocol and the iterator protocol.

Iterable protocol: this object must have @ @ iterator and can be accessed through Symbol.iterator

Iterator protocol: is an object whose next () function returns an object, which includes two properties, one is value and the other is done (boolean, is the last element, value can be omitted when done is true)

In other words, an iterator object is essentially a pointer object. Move the pointer through the next () of the pointer object.

Custom iteration

The object does not implement an iterator, so we cannot traverse the object. In order to traverse the object, we need to implement the iterator mentioned above on the object. There are usually two ways to write it, one is the traditional writing method, which requires you to control the internal state, and the other is to use the iterator of Generator returned by the generator function. The code is as follows:

Traditional writing method

Let obj = {name: 'joel', adress:' gz', [Symbol.iterator]: () = > {/ / do not use this here, because it is return fn, this will lose let index =-1, atrrList = Object.keys (obj) Const objIterator = {next: () = > {let result =''index++ if (index < atrrList.length) {result = {value: atrrList [index] Done: false}} else {result = {done: true}} return result}} return objIterator}} for (const item of obj) {console.log ('atrrs:' + item +', value:' + obj [item])}

Generator function writing

/ / add iterator let obj = {a: 1, b: 2} obj [symbol. Iterator] = function* () {let keys = Object.keys (obj); / / take the length of the key value let len = keys.length; / / define the loop variable let n = 0; / / conditional judgment while (n)

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.