React+Flow Type中扩展运算符转Set异常，Array.from正常的问题

问题关联分析 #

• 与Stack Overflow关于「Set转数组」的提问间接相关：该提问讨论标准JS中[...Set]和Array.from(Set)的等价性，但你的问题核心是Flow环境下的转译逻辑差异，而非标准语法本身。
• 与TypeScript的相关Issue高度相关：TS的该Issue暴露了扩展运算符处理Set时的类型转译Bug，Flow存在类似问题——对[...mySet]的类型识别与转译逻辑出现偏差，导致最终代码行为异常。

为何输出[{}]？ #

在标准JS中，[...mySet]和Array.from(mySet)都会通过调用Set的Symbol.iterator接口生成数组，行为完全一致。但在Flow项目中二者表现差异的原因在于：

1. 扩展运算符的转译错误：Flow错误地将Set实例识别为普通非Iterable对象，转译[...mySet]时没有调用Set的迭代器，而是尝试以对象解构逻辑处理。由于Set本身没有可枚举的自有属性，解构后得到空对象，最终数组就是[{}]。
2. Array.from的正确处理：Array.from的类型定义明确要求接收Iterable对象，Flow对这个API的类型校验和转译逻辑是正确的，能正常调用Set的迭代器生成正确数组。

而纯React项目使用默认Babel转译配置，Babel能正确识别Set的Iterable接口，因此两种写法都能正常工作。

临时解决方案 #

在Flow项目中，暂时使用Array.from(mySet)替代[...mySet]来转换Set为数组；也可以检查Flow版本和Babel插件配置，确保二者对Iterable类型的处理兼容。

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