TypeScript 中的可迭代对象

在 TypeScript 中，可迭代对象是一个实现了 Symbol.iterator 接口的对象，它可以被 for-of 循环遍历。在本文中，我们将深入了解可迭代对象的概念、用法和示例。

可迭代对象的定义

可迭代对象是一个具有 Symbol.iterator 属性的对象。该属性是一个函数，返回一个迭代器对象。迭代器对象是具有 next 方法的对象，该方法返回一个对象，包含两个属性：value 和 done。value 属性表示当前迭代的值，done 属性表示是否迭代完成。

下面是一个简单的可迭代对象示例：

// javascriptcn.com 代码示例
const iterable = {
  [Symbol.iterator]() {
    let i = 0;
    const data = [1, 2, 3];

    return {
      next() {
        if (i < data.length) {
          return { value: data[i++], done: false };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
};

for (const item of iterable) {
  console.log(item);
}

使用 for-of 循环遍历可迭代对象

for-of 循环是一种新的循环语法，它可以遍历可迭代对象中的值。在 TypeScript 中，for-of 循环可以用来遍历数组、字符串、Map、Set 和自定义的可迭代对象。

下面是一个使用 for-of 循环遍历数组的示例：

const arr = [1, 2, 3];

for (const item of arr) {
  console.log(item);
}

下面是一个使用 for-of 循环遍历字符串的示例：

const str = "hello";

for (const char of str) {
  console.log(char);
}

下面是一个使用 for-of 循环遍历 Map 的示例：

const map = new Map([["key1", "value1"], ["key2", "value2"]]);

for (const [key, value] of map) {
  console.log(key, value);
}

自定义可迭代对象

我们可以创建自己的可迭代对象，只需要实现 Symbol.iterator 方法即可。

下面是一个自定义可迭代对象的示例：

// javascriptcn.com 代码示例
class MyIterable {
  private data: number[];

  constructor() {
    this.data = [1, 2, 3];
  }

  [Symbol.iterator]() {
    let i = 0;
    const data = this.data;

    return {
      next() {
        if (i < data.length) {
          return { value: data[i++], done: false };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
}

const myIterable = new MyIterable();

for (const item of myIterable) {
  console.log(item);
}

总结

在 TypeScript 中，可迭代对象是一个实现了 Symbol.iterator 接口的对象，它可以被 for-of 循环遍历。我们可以使用 for-of 循环遍历数组、字符串、Map、Set 和自定义的可迭代对象。自定义可迭代对象只需要实现 Symbol.iterator 方法即可。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65126bf295b1f8cacdae36b0