TypeScript：类型 'T' 不满足约束 '(...args: any) => any'

Question

我有以下 redux-thunk 动作创建者：

function updateInitiator(form_request_id, { to_recipient }) {
  return (dispatch) => {
    const url = `/some/url`;
    const data = { to_recipient };

    return fetch(url, { method: 'PUT', body: JSON.stringify(data) }).then(() => {
      dispatch(fetchResponses());
    });
  };
}

然后我声明函数的类型：

type UpdateInitiator = typeof updateInitiator;

我正在尝试导出绑定 thunk 操作的类型。简而言之，当 action creator 在 react-redux 中是 "bound" 时，它会自动调用函数 returned with dispatch 然后 returns return 结果that 内部函数。我正在尝试为此行为声明一个类型。如果我不使用泛型就可以工作：

type BoundUpdateInitiator = (...args: Parameters<UpdateInitiator>) => ReturnType<ReturnType<UpdateInitiator>>;

但是当我尝试为任何绑定函数声明泛型类型时，我遇到了一些麻烦：

type BoundThunk<T> = (...args: Parameters<T>) => ReturnType<ReturnType<T>>;
type BoundUpdateInitiator = BoundThunk<UpdateInitiator>;

这给了我错误：

error TS2344: Type 'T' does not satisfy the constraint '(...args: any) => any'.

236 type BoundThunk<T> = (...args: Parameters<T>) => ReturnType<ReturnType<T>>;
                                              ~

error TS2344: Type 'ReturnType<T>' does not satisfy the constraint '(...args: any) => any'.
  Type 'unknown' is not assignable to type '(...args: any) => any'.
    Type '{}' provides no match for the signature '(...args: any): any'.

236 type BoundThunk<T> = (...args: Parameters<T>) => ReturnType<ReturnType<T>>;
                                                                ~~~~~~~~~~~~~

error TS2344: Type 'T' does not satisfy the constraint '(...args: any) => any'.

236 type BoundThunk<T> = (...args: Parameters<T>) => ReturnType<ReturnType<T>>;
                                                                           ~

我隐约明白T可能不是函数，同样ReturnType<T>也可能不是函数，这种泛型可能不考虑这些情况。然而，我无法理解我如何可以解释它们。理想情况下不允许他们。有什么建议吗？

Answer 1

为了实现这一点，我们将使用通用类型约束。

事实上，这就是语言提供的实用程序类型 Parameters<T> 和 ReturnType<T> 的类型参数的指定方式，从而导致您收到错误。

为了用我们的类型参数实例化一个泛型类型，比如 ReturnType<T>，我们的类型参数必须至少与 ReturnType<T> 中的类型参数 T 一样严格。

通过查看ReturnType<T>的定义我们可以确定最小约束（正式称为上限），我们需要应用和关联的语法

type ReturnType<T extends (...args: any[]) => any> =
    // details

不要担心实施（在 = 之后），因为这是一个更广泛的话题。在这种情况下，我们将重点关注 T 的约束，在 T 的声明中使用 extends 关键字指定。

因此，为了将T declared由BoundThunk<T>传递给ReturnType<T>，我们必须对其进行约束以满足上述要求（注意Parameters<T>具有相同的约束条件） .

type BoundThunk<T extends (...args: any[]) => any> =
    (...args: Parameters<T>) => ReturnType<ReturnType<T>>;

然而，我们对 T 的要求实际上更多限制，因为我们应用 ReturnType<T> 两次，ReturnType<ReturnType<T>>，这意味着 T 是一个高阶函数，在本例中是 returns 一个函数的函数。

因此，我们将相应地改进我们的约束条件

type BoundThunk<T extends (...args: any[]) => (...args: any[]) => any> =
    (...args: Parameters<T>) => ReturnType<ReturnType<T>>;

TypeScript：类型 'T' 不满足约束 '(...args: any) => any'

TypeScript: Type 'T' does not satisfy the constraint '(...args: any) => any'

typescript

reactjs

redux-thunk