打字稿，不同的函数参数

Question

在我的 Preact 应用程序中，我使用 unistore 进行全局状态管理。一切正常，除了我的打字稿界面不工作。这是因为操作（解析器）有一个额外的参数。

我的 incrementBy 操作有两个参数。第一个是当前状态，第二个是增加计数的数量。

// Inside action (resolver)
incrementBy: (state, num): State => {
  return { ...state, count: state.count + num };
};

但是当我调用函数时我只需要指定增加的数量：

// Inside component
<button onClick={() => incrementBy(8)}>
  Increase by 8
</button>

当前界面（这适用于组件但（显然）不在操作内）：

interface Actions {
  incrementBy(num: number): State;
}

我如何制作一个同时适用于两者的界面，这样我就不必为每个操作指定多个界面。

Answer 1

你或许可以这样实现：

export interface IIncrementParams {
  state?: State;
  num?: number;
}

interface IActions {
  incrementBy(params: IIncrementParams): State;
}

您可以这样做：

incrementBy({num: 8});
incrementBy({state: someState});
incrementBy({state: someState, num: 8});

选项 2 是您可以提供多个签名：

interface IActions {
  incrementBy(num: number): State;
  incrementBy(state: State, num: number): State;
}

TypeScript function overloading

Typescript, different function arguments