前言
在 ES6 中，引入了 Symbol 类型，它是一种新的原始数据类型，用于表示独一无二的值。其中，Symbol.iterator 是用来定义对象的默认迭代器的属性。在本文中，我们将详细介绍 Symbol.iterator 的使用及实现方式。
Symbol.iterator 的作用
在 ES6 中，许多内置的数据结构都实现了 Symbol.iterator 属性，例如数组、Set、Map 等。这意味着我们可以使用 for...of 循环来遍历这些数据结构的值。
使用 Symbol.iterator 属性，我们可以自定义对象的迭代器。这样，我们就可以使用 for...of 循环来遍历我们自己定义的对象了。
Symbol.iterator 的使用示例
下面是一个简单的示例，展示了如何使用 Symbol.iterator 来自定义对象的迭代器：
// javascriptcn.com 代码示例
let myObj = {
data: [1, 2, 3],
[Symbol.iterator]() {
let index = 0;
let data = this.data;
return {
next() {
if (index < data.length) {
return { value: data[index++], done: false };
} else {
return { value: undefined, done: true };
}
}
};
}
};
for (let value of myObj) {
console.log(value);
}在上面的示例中，我们定义了一个名为 myObj 的对象，并在该对象上定义了一个 Symbol.iterator 方法。该方法返回一个迭代器对象，每次调用 next() 方法时，都会返回一个包含 value 和 done 两个属性的对象。
在 for...of 循环中，我们使用了 myObj 对象的迭代器来遍历该对象的值。这样，我们就可以像遍历数组一样遍历我们自己定义的对象了。
Symbol.iterator 的实现方式
上面的示例中，我们使用了 Symbol.iterator 方法来定义对象的迭代器。该方法返回一个迭代器对象，该对象包含 next() 方法，用于返回迭代器中下一个值。
下面是一个更复杂的示例，展示了如何使用 Symbol.iterator 来实现一个自定义的双向链表：
// javascriptcn.com 代码示例
class Node {
constructor(data) {
this.data = data;
this.prev = null;
this.next = null;
}
}
class LinkedList {
constructor() {
this.head = null;
this.tail = null;
this[Symbol.iterator] = this.forwardIterator;
this.reverseIterator = this.reverseIterator.bind(this);
}
add(data) {
let node = new Node(data);
if (!this.head) {
this.head = node;
this.tail = node;
} else {
node.prev = this.tail;
this.tail.next = node;
this.tail = node;
}
}
forwardIterator() {
let current = this.head;
return {
next() {
if (current) {
let value = current.data;
current = current.next;
return { value: value, done: false };
} else {
return { value: undefined, done: true };
}
}
};
}
reverseIterator() {
let current = this.tail;
return {
next() {
if (current) {
let value = current.data;
current = current.prev;
return { value: value, done: false };
} else {
return { value: undefined, done: true };
}
}
};
}
[Symbol.iterator]() {
return this.forwardIterator();
}
}
let list = new LinkedList();
list.add(1);
list.add(2);
list.add(3);
for (let value of list) {
console.log(value);
}
console.log("-----");
list[Symbol.iterator] = list.reverseIterator;
for (let value of list) {
console.log(value);
}在上面的示例中，我们定义了一个名为 LinkedList 的类，用于表示双向链表。在该类中，我们定义了 add() 方法，用于向链表中添加节点。
为了实现迭代器，我们在 LinkedList 类中定义了 forwardIterator() 和 reverseIterator() 两个方法，分别用于正向和反向遍历链表。在 forwardIterator() 方法中，我们从头节点开始遍历链表，每次调用 next() 方法时，都会返回下一个节点的值。在 reverseIterator() 方法中，我们从尾节点开始遍历链表，每次调用 next() 方法时，都会返回上一个节点的值。
在 LinkedList 类中，我们还定义了 Symbol.iterator 方法，用于返回正向遍历链表的迭代器。在我们使用 for...of 循环遍历链表时，就会使用该迭代器。
在最后的示例中，我们先使用正向遍历链表的迭代器来遍历链表的值。然后，我们将 LinkedList 类的 Symbol.iterator 方法重新定义为 reverseIterator() 方法，这样，我们就可以使用反向迭代器来遍历链表的值了。
总结
在本文中，我们介绍了 ES6 中 Symbol.iterator 的使用及实现方式。通过自定义对象的迭代器，我们可以使用 for...of 循环来遍历我们自己定义的对象。在实现自定义迭代器时，我们需要定义一个包含 next() 方法的迭代器对象。
希望本文能够对前端开发者们有所帮助，让大家更加深入地理解 ES6 中 Symbol.iterator 的使用及实现方式。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/655922a1d2f5e1655d39bfca