Series of links:
Js traversal object -for… And in the Object. The keys
Js traversal object part 2 – enumerability and Symbol
Iterator
ES6 states that the default Iterator interface is deployed in the symbol. Iterator property of a data structure (pointing to the default Iterator method for that object), or that a data structure can be considered “iterable” as long as it has the symbol. Iterator property. The symbol. iterator property is itself a function that is the default traverser generator for the current data structure. Executing this function returns a traverser. Iterator is an expression that returns the iterator property of the Symbol object, which is a predefined special value of type Symbol, so it is enclosed in square brackets.
The data structures with the Iterator interface are as follows:
- Array
- Map
- Set
- String
- TypedArray
- The arguments object for the function
- The NodeList object
Above Iterator related introduction text from ruan Yifeng teacher ES6 tutorial
let arr = ['a'.'b'.'c'];
let iter = arr[Symbol.iterator]();
console.log(iter.next()); // { value: 'a', done: false }
console.log(iter.next()); // { value: 'b', done: false }
console.log(iter.next()); // { value: 'c', done: false }
console.log(iter.next()); // { value: undefined, done: true }
Copy the code
Add the Iterator interface
1. Add an Iterator interface to the object
for… of… Iterator interface is required to iterate over objects
// Cannot iterate over objects because they have no native Iterator interface
// const obj = {
// name: 'lsc',
// age: 21
// }
// for (let item of obj) {
// console.log(item); // TypeError: obj is not iterable
// }
// Add an iterator interface to the object
const obj2 = {
name: 'lsc'.age: 21.height: 187[Symbol.iterator] () {
const self = this
const keys = Object.keys(self)
let index = 0
return {
next() {
if (index < keys.length) {
return {
value: self[keys[index++]],
done: false}}else {
return {value: undefined.done: true}
}
}
}
}
}
for (let item of obj2) {
console.log(item);
}
Copy the code
2. Add an iterator interface to the class array
Arguments /nodelist and other common pseudo-arrays have an iterator interface of their own, so this is where the native pseudo-arrays are documented
// This example comes from ruan Yifeng ES6 tutorial
let iterable = {
0: 'a'.1: 'b'.2: 'c'.length: 3[Symbol.iterator]: Array.prototype[Symbol.iterator]
};
for (let item of iterable) {
console.log(item); // 'a', 'b', 'c'
}
Copy the code
But it’s easier to convert a pseudo-array directly to an Array using the extension operator or array. from
Generator
Generator is both a state machine and an iterator Generator function, so you can assign Generator to the Symbol. Iterator property of an object
const obj2 = {
name: 'lsc'.age: 21.height: 187[Symbol.iterator]: function* myIterator(){
for(let key of Object.keys(this))
yield this[key]; }}for (let item of obj2) {
console.log(item); // lsc 21 187
}
Copy the code