如何在TypeScript中定义支持解构的自定义Iterable类型并正确标注类型

要实现支持解构赋值的自定义可迭代对象，核心是正确指定Iterable的泛型参数，并准确标注迭代器的类型，具体步骤如下：

1. 确定Iterable的泛型参数 #

Iterable<T>中的T是迭代器每次yield返回值的类型。如果你的迭代器会返回多种不同类型的值（比如state的类型T和setState的类型E），那么泛型参数应为这些类型的联合类型，即T | E。

2. 定义接口并扩展Iterable #

在自定义接口中，除了声明对象的核心属性（如state、setState），还要明确标注[Symbol.iterator]方法的类型为生成器函数：

interface MyObjectsInterface<T, E> extends Iterable<T | E> {
  state: T;
  setState: E;
  // 声明迭代器方法的类型
  [Symbol.iterator](): Generator<T | E, void, undefined>;
}

3. 实现可迭代对象 #

使用生成器函数（function*）编写迭代器逻辑，TypeScript会根据yield的顺序自动推断解构赋值时的元组类型：

const myObject: MyObjectsInterface<number, (newState: number) => void> = {
  state: 0,
  setState(newState: number) {
    this.state = newState;
  },
  *[Symbol.iterator]() {
    yield this.state;
    yield this.setState;
    // 可添加更多yield语句，对应解构的后续变量
  }
};

4. 验证解构赋值的类型推断 #

此时解构赋值会自动识别每个变量的类型：

let [state, setState] = myObject;
// state 类型为 number，setState 类型为 (newState: number) => void

内容的提问来源于stack exchange，提问作者Incepter