是否可以通过这种方式为可选参数重载 Typescript 函数？

Question

我认为这个问题的答案可能是没有办法做到这一点，因为我还没有弄清楚如何让它工作，但这就是我想做的。 假设我有一个 function 接受 3 个数字，最后两个是可选的。 我想允许将可选参数作为它们自己的参数提供或组合到 object 中，其中每个参数都是可选的。

像这样的东西尽可能接近，但解构不起作用：

function add(a: number, b?: number, c?: number): number;
function add(a: number, {b, c}: {b?: number, c?: number}): number;
function add(a: number, b?: any, c?: number): number {
    return a + (b ? b : 0) + (c ? c : 0);
}
console.log('a + b + c: ' + add(3, undefined, 8));
console.log('a + b + c: ' + add(3, {c: 8}));

a + b + c: 11
a + b + c: 3[object Object]0

实际用例是一个具有更多参数的方法，我们希望保持向后兼容，但为了简单起见，我们希望在调用它时添加 object 变体。

Answer 1

重载调用签名和类型注释是 TypeScript 的 static 类型系统的一部分，当 TypeScript 代码被转译为 Z686155AF75A60A0F6E9D80C1F7EDD3EZ9 时，该系统会被删除。

这意味着您的add() function 在实际运行时变为以下内容：

// transpiled
function add(a, b, c) {
    return a + (b ? b : 0) + (c ? c : 0);
}

如您所见，那里没有进行解构。 如果您希望b和c来自参数对或单个 object，则需要在 function实现中发生该逻辑。 我可以这样写：

function add(a: number, b?: number, c?: number): number;
function add(a: number, { b, c }: { b?: number, c?: number }): number;
function add(a: number, p1?: number | { b?: number, c?: number }, p2?: number): number {
    const b = typeof p1 === "object" ? p1.b : p1;
    const c = typeof p1 === "object" ? p1.c : p2
    return a + (b || 0) + (c || 0);
}

实现签名具有名为p1和p2的 arguments ，它们是类似的 arguments 的联合，来自可能的调用方式add() 。 然后我们必须从p1和p2计算b和c 。 这应该按您期望的方式工作：

console.log('a + b + c: ' + add(3, undefined, 8)); // 11
console.log('a + b + c: ' + add(3, { c: 8 })); // 11

好的，希望对您有所帮助； 祝你好运！

Playground 代码链接