使用 Spread 运算符时出现 TypeScript 错误？

Posted 2023-03-13

【中文标题】使用 Spread 运算符时出现 TypeScript 错误？

【英文标题】：TypeScript error when using the Spread operator?

【发布时间】：2017-12-26 18:22:41

【问题描述】：

每当我使用如下的扩展运算符时

public drawTextTest(p1: number, p2: number, p3: number):void 
    console.log(p1, p2, p3);

let array = [2, 2, 5];
this.drawTextTest( ... array );

我在编辑器中收到此错误

[ts] 应有 # 个参数，但至少有 0 个。

为什么 TypeScript 在使用扩展运算符传递参数时会出错？

当我实际运行代码时没有错误，展开运算符只是让我将数组用作函数的参数，但在 VSCode 中它向我显示错误，就好像我不能一样。

【问题讨论】：

请选择粘贴代码，而不是截图。

代码在编译时运行良好，只是在编辑器中时出现错误。

tslib 版本的 vscode 较旧，无法推断元组

【参考方案1】：

Vscode 可能正在使用 2.1 之前的 typescript 版本来评估代码。仔细检查 IDE 窗口右下角的版本。

如果我错了，我需要查看您的 drawInfo 对象定义。 我的第二个猜测是 drawInfo 具有可选属性，并且评估者看到了传播会导致 0 参数的可能性。

编辑：drawInfo 似乎是一个数组。因为数组的长度是可以改变的，并且不能保证有 3 个属性，所以 ts 求值器会报错。

如果 drawInfo 将始终包含 3 个值，您可能希望将其从数组更改为已定义的类型并避免使用扩展运算符。

【讨论】：

VSCode 在 TypeScript 2.4.2 上运行。我更新了我给出的示例，但仍然出现错误

this.drawTextTest( ...(array as [any, any, any] ))

【参考方案2】：

较新版本的 TypeScript 应该通过流分析来解决这个问题，但您应该能够通过手动键入数组以确保最小长度来使代码正常工作：

function drawTextTest(p1: number, p2: number, p3: number):void 
    console.log(p1, p2, p3);

let array: [number, number, number] = [2, 2, 5];
this.drawTextTest( ... array );

【讨论】：

这更符合我的想法，但 TS 仍然给出相同的错误

2020 年也一样，我认为这肯定有效，但它给出了相同的错误

【参考方案3】：

类型化扩展运算符仅在所有参数都标记为可选时才起作用

public drawTextTest(p1?: number, p2?: number, p3?: number):void

见https://github.com/Microsoft/TypeScript/issues/4130#issuecomment-303486552