当前位置：首页 > JavaScript

js实现forof

2026-03-14 04:49:17JavaScript

for...of 循环的实现

JavaScript 的 for...of 循环用于遍历可迭代对象（如数组、字符串、Map、Set 等）。以下是几种实现方式：

使用 Symbol.iterator

可迭代对象必须实现 [Symbol.iterator] 方法。可以通过自定义迭代器实现 for...of 的功能：

js实现forof

const iterable = {
  [Symbol.iterator]() {
    let step = 0;
    const iterator = {
      next() {
        step++;
        if (step <= 5) {
          return { value: step, done: false };
        }
        return { value: undefined, done: true };
      }
    };
    return iterator;
  }
};

for (const value of iterable) {
  console.log(value); // 输出 1, 2, 3, 4, 5
}

手动实现类似 for...of 的功能

如果不使用 for...of 语法，可以通过手动调用迭代器实现类似功能：

js实现forof

const arr = [1, 2, 3];
const iterator = arr[Symbol.iterator]();

let result = iterator.next();
while (!result.done) {
  console.log(result.value); // 输出 1, 2, 3
  result = iterator.next();
}

生成器函数

生成器函数返回的也是可迭代对象，可以直接用于 for...of：

function* generateSequence() {
  yield 1;
  yield 2;
  yield 3;
}

for (const value of generateSequence()) {
  console.log(value); // 输出 1, 2, 3
}

自定义类的迭代器

可以通过在类中定义 [Symbol.iterator] 方法使类支持 for...of：

class Range {
  constructor(start, end) {
    this.start = start;
    this.end = end;
  }

  [Symbol.iterator]() {
    let current = this.start;
    const end = this.end;
    return {
      next() {
        if (current <= end) {
          return { value: current++, done: false };
        }
        return { done: true };
      }
    };
  }
}

for (const num of new Range(1, 5)) {
  console.log(num); // 输出 1, 2, 3, 4, 5
}