JavaScript Symbol 和迭代器

在 JavaScript 中，我们经常需要遍历对象或数组。但有时，我们需要自定义遍历顺序或方式，例如按照插入顺序遍历 Set 或 Map。这时，Symbol 和迭代器就派上用场了。

理解 Symbol 和迭代器

Symbol：独一无二的值

Symbol 是一种特殊的数据类型，它代表独一无二的值。在对象属性的命名上，Symbol 能有效避免命名冲突，为每个属性提供唯一的标识符。

const mySymbol = Symbol('mySymbol');  
console.log(mySymbol); // Symbol(mySymbol)  
console.log(Symbol('mySymbol') === mySymbol); // 输出 false，因为每次调用 Symbol() 都会产生新的唯一值

迭代器：控制遍历过程

迭代器是一个对象，它定义了访问数据结构元素的标准化方式。迭代器拥有一个 next() 方法，每次调用此方法都会返回一个对象，包含 value（当前元素值）和 done（是否遍历完成）两个属性。

const myArray = [1, 2, 3];  
const iterator = myArray[Symbol.iterator](); // 获取数组的默认迭代器  
  
console.log(iterator.next()); // { value: 1, done: false }  
console.log(iterator.next()); // { value: 2, done: false }  
console.log(iterator.next()); // { value: 3, done: false }  
console.log(iterator.next()); // { value: undefined, done: true }，表示遍历完成

自定义迭代器：以 Set 为例

我们可以使用 Symbol.iterator 为自定义对象或已有的数据结构创建迭代器，从而实现自定义遍历方式。

以下代码演示了如何为 Set 对象创建自定义迭代器，使其按照插入顺序遍历元素：

const mySet = new Set();  
mySet.add('a');  
mySet.add('b');  
mySet.add('c');  
  
// 记录插入顺序  
const entries = [];  
mySet.forEach(value => entries.push(value));  
  
// 定义自定义迭代器  
mySet[Symbol.iterator] = function* () {  
  for (let i = 0; i < entries.length; i++) {  
    yield entries[i]; // 使用 yield 逐个产出元素  
  }  
};  
  
// 利用 for...of 循环进行遍历，按插入顺序输出结果  
for (const value of mySet) {  
  console.log(value); // 顺序输出：a b c  
}

在此示例中：

• 我们通过 Symbol.iterator 为 mySet 赋予了一个新的生成器函数。
• 这个生成器函数利用 yield 关键字，按照 entries 数组的顺序逐个产出元素。
• 当我们使用 for...of 循环遍历 mySet 时，就会调用这个自定义的迭代器，实现按插入顺序的输出。

总结

通过 Symbol 和迭代器，我们可以灵活地控制 JavaScript 中的遍历行为。