function - 具有多个调用签名的 TypeScript 接口(interface)

标签 function typescript interface overloading

我在 TypeScript 2.2 中看到了通过定义的接口(interface)调用签名“重载”函数的选项,我花了很多时间来了解如何使用它。

所以在研究并“破解”它之后,我认为将它张贴在这里是值得的。

我开始的问题是,例如:

interface Func1 {
    (num1: number, num2: number): number;
    (str1: number, str2: string): string;
}

function F1(num1: number, num2: number): number {
    return num1 + num2;
}

const f1: Func1 = F1;
console.log(f1(1, 2));

但是编译器没有通过它,因为 Func1 不能接受 F1 函数。

我想重载,但我不知道该怎么做。

请参阅下面的答案。

最佳答案

在挖掘它之后我发现我们可以做相当多的重载。 TypeScript 中的重载与任何其他 JavaScript 代码没有什么不同。它必须在一个函数中实现,而不是像在C++中那样在多个函数中实现。您需要让您的函数接受所有选项。

例如:

interface Func1 {
    (v1: number, v2: number): number;
    (v1: string, v2: string): string;
}

const f1: Func1 = (v1, v2): any => {
    return v1 + v2;
};
console.log(f1("1", "2"));
console.log(f1(1, 2));

函数 f1 假设重载接口(interface)调用签名的所有选项都有类型,如果你设置强类型,它会阻止你,因为类型不可转换。就像这个例子中的 number 不可转换为 string

您还可以创建多个使用接口(interface)调用签名重载的函数,并将它们传递给您的 f1,如果类型匹配,它将通过。只需确保您的函数可以处理所有接口(interface)调用签名即可。

在使用类或函数参数不简单时,检查实现函数的类型很重要,如上例,使用 typeof 并控制所有选项。

希望对您有所帮助。

关于function - 具有多个调用签名的 TypeScript 接口(interface),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43457512/

相关文章:

javascript - 在 AngularJs 中,如何将函数合并为通用函数以用于不同的 Controller ?

javascript - Js函数调用另一种方式

python - 为什么用不同的__init__代码继承相同的类?盈透证券API

python - 扭曲的 python : UDP Multicast Interface and Group

java - 标准接口(interface)

C 程序用新行反转字符串

c++ - 从多个函数指针中提取参数参数列表的元函数

typescript - 为什么数组和字符串的长度属性有不同的返回类型?

typescript - 使用 TypeScript 类型系统创建一个流畅的、有状态的构建器

angular - 使用已知/声明的组件插入动态 Angular 4.x 内容