遍历枚举骚操作之惊天大逆袭

2023-11-08 09:22:25

迭代器接口
迭代器接口是一个对象，它提供了一个next()方法，该方法返回一个对象，其中包含一个done属性和一个value属性。done属性是一个布尔值，表示迭代是否完成。value属性是当前迭代项的值。

可以手动创建一个迭代器，方法是定义一个对象，该对象实现Symbol.iterator方法。Symbol.iterator方法返回一个迭代器对象。

const myIterable = {
  [Symbol.iterator]() {
    let i = 0;
    return {
      next() {
        if (i < 3) {
          return { value: i++, done: false };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
};

for (const item of myIterable) {
  console.log(item); // 0 1 2
}

Generator

Generator是一种特殊的函数，它可以暂停执行并返回一个值。要创建一个Generator，可以使用yield。yield关键字会暂停Generator的执行，并返回一个值。当Generator被调用时，它会从yield处继续执行。

function* myGenerator() {
  yield 0;
  yield 1;
  yield 2;
}

const generator = myGenerator();

console.log(generator.next()); // { value: 0, done: false }
console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 2, done: false }
console.log(generator.next()); // { value: undefined, done: true }

Symbol.iterator

Symbol.iterator是一个内置符号，它表示对象的默认迭代器。当一个对象被用作for of循环的迭代器时，会自动调用该对象的Symbol.iterator方法。如果对象没有实现Symbol.iterator方法，则会抛出一个错误。

const myObject = {
  [Symbol.iterator]: function*() {
    yield 0;
    yield 1;
    yield 2;
  }
};

for (const item of myObject) {
  console.log(item); // 0 1 2
}

骚操作之惊天大逆袭

了解了迭代器接口、Generator和Symbol.iterator之后，就可以开始骚操作了。

骚操作一：使用for of循环遍历数组

const arr = [0, 1, 2];

for (const item of arr) {
  console.log(item); // 0 1 2
}

骚操作二：使用for of循环遍历字符串

const str = 'hello';

for (const char of str) {
  console.log(char); // h e l l o
}

骚操作三：使用for of循环遍历Set

const set = new Set([0, 1, 2]);

for (const item of set) {
  console.log(item); // 0 1 2
}

骚操作四：使用for of循环遍历Map

const map = new Map([
  ['a', 0],
  ['b', 1],
  ['c', 2]
]);

for (const [key, value] of map) {
  console.log(key, value); // a 0 b 1 c 2
}

骚操作五：使用Generator创建斐波那契数列

function* fibonacci() {
  let [prev, curr] = [0, 1];
  while (true) {
    [prev, curr] = [curr, prev + curr];
    yield curr;
  }
}

const generator = fibonacci();

console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 2, done: false }
console.log(generator.next()); // { value: 3, done: false }
console.log(generator.next()); // { value: 5, done: false }

骚操作六：使用Symbol.iterator创建自定义迭代器

const myIterable = {
  [Symbol.iterator]: function*() {
    yield 0;
    yield 1;
    yield 2;
  }
};

for (const item of myIterable) {
  console.log(item); // 0 1 2
}