Question

在尝试将WebGL2 typings集成到我们的项目中时，我遇到了类型错误，我可以归结为以下snippet：

interface WebGL2RenderingContext {
  bufferData(target: number, size: number, usage: number): void;
  bufferData(target: number, srcData: ArrayBuffer, usage: number): void;
}

function test(gl: WebGL2RenderingContext, sizeOrData: number|ArrayBuffer){
  gl.bufferData(0, sizeOrData, 0);
}

导致以下编译错误：

类型'数字|的参数ArrayBuffer'不能赋值给'ArrayBuffer'类型的参数。类型'number'不能分配给'ArrayBuffer'类型。

据我所知，这应该是有效的代码，但我不完全确定我是否遇到过TS中的错误，错误的打字或者错误是否在我的最后。有什么建议？

Answer 1

这是因为overloads do not resolve based on union types。对于第二个参数，重载都不匹配number|ArrayBuffer类型，并且编译器不理解可以合并这对重载。目前还没有解决这个问题的计划，尽管这被认为是一个痛点。

这意味着bufferData()的WebGL2类型不完全不正确，但它们并不好。 TypeScript手册“做与不做”页面专门将其列为"Don't"。由于签名的区别仅在于一个参数的类型，因此最好使用union类型，如下所示：

interface WebGL2RenderingContext {
  bufferData(target: number, sizeOrData: number | ArrayBuffer, usage: number): void;
}

然后你的代码不会抛出错误。代替将此定义提供回上游，您可以通过declaration merging在本地将其自己添加到您自己的代码中，一切都适合您。

希望有所帮助;祝你好运！

打字稿：数字|的函数重载解析ArrayBuffer

1 个答案: