无法使 TypeScript 泛型链正常工作 [英] Can't make TypeScript generics chain work

问题描述

我正在构建一个接受函数链的函数，其中每个函数都转换前一个函数的结果.在给定的例子中，_context 应该等于 { hello: 'world', something: 'else' }:

I'm building a function that accepts a functions chain, where each function transforms results from the previous one. In the given example, _context should be equal { hello: 'world', something: 'else' }:

function withWorld<Context extends {}>(context: Context) {
  return { ...context, hello: 'world' }
}

function withSomething<Context extends {}>(context: Context) {
  return { ...context, something: 'else' }
}

test([withWorld, withSomething], (_context) => {})

然而，当我尝试用泛型描述这种行为时，我偶然发现了一个错误:

However, when I try to describe this behavior with generics, I stumble upon an error:

No overload matches this call:
  Types of parameters 'contextSomething' and 'contextB' are incompatible.
    Type 'unknown' is not assignable to type '{}'.

这是代码(打字稿游乐场):

export interface TestFunction {
  <A>(
    conditions: [(contextSolo: {}) => A],
    body: (contextBodySolo: A) => any
  ): any

  <A, B>(
    conditions: [(contextA: {}) => A, (contextB: A) => B],
    body: (contextBody: B) => void
  ): any
}

const test: TestFunction = () => void 0

function withWorld<Context extends {}>(contextWithWorld: Context) {
  return { ...context, hello: 'world' }
}

function withSomething<Context extends {}>(contextSomething: Context) {
  return { ...context, something: 'else' }
}

test([withSomething], (_context) => {})
test([withWorld], (_context) => {})
test([withWorld, withSomething], (_context) => {})

当数组中只有一个函数时，TypeScript 可以推断类型，即使示例更复杂并且具有初始状态 (打字稿游乐场).

When there's a single function in the array, TypeScript infers the types alright, even when the example is more complicated and has an initial state (TypeScript playground).

完全错误:

No overload matches this call.
  Overload 1 of 2, '(conditions: [(contextSolo: {}) => any], body: (contextBodySolo: any) => any): any', gave the following error.
    Argument of type '[<Context extends {}>(contextWithWorld: Context) => any, <Context extends {}>(contextSomething: Context) => any]' is not assignable to parameter of type '[(contextSolo: {}) => any]'.
      Source has 2 element(s) but target allows only 1.
  Overload 2 of 2, '(conditions: [(contextA: {}) => unknown, (contextB: unknown) => any], body: (contextBody: any) => void): any', gave the following error.
    Type '<Context extends {}>(contextSomething: Context) => any' is not assignable to type '(contextB: unknown) => any'.
      Types of parameters 'contextSomething' and 'contextB' are incompatible.
        Type 'unknown' is not assignable to type '{}'.(2769)

推荐答案

这里有工作示例:

export interface TestFunction<Ctx> {
  <A>(
    conditions: [(context: Ctx) => A],
    body: (context: A) => any
  ): any

  <A, B>(
    conditions: [(context: Ctx) => A & Ctx, (context: A & Ctx) => B],
    body: (context: B & Ctx) => void
  ): any
}

const test: TestFunction<{ hello: 'world' }> = () => void 0

function withWorld<Context extends { hello: 'world' }>(context: Context) {
  return { ...context, world: 'hello' }
}

function withSomething<Context extends {}>(context: Context) {
  return { ...context, something: 'else' }
}

test([withSomething], (_context) => void 0)
test([withWorld], (_context) => void 0)
test([withWorld, withSomething], (_context) => void 0)

我明确添加了 Ctx 作为每个参数的交集

I explicitly added Ctx as intersection to each argument

更新

这里有通用的解决方案:

Here you have generic solution:

type Fn = (...args: any[]) => any
type MapObject<T extends Fn> = ReturnType<T>
type Elem = Fn

type Mapper<
  Arr extends ReadonlyArray<Elem>,
  Result extends Record<string, any> = {}
  > = Arr extends []
  ? Result
  : Arr extends [infer H]
  ? H extends Elem
  ? Result & MapObject<H>
  : never
  : Arr extends readonly [infer H, ...infer Tail]
  ? Tail extends ReadonlyArray<Elem>
  ? H extends Elem
  ? Mapper<Tail, Result & MapObject<H>>
  : never
  : never
  : never


type Foo = { foo: 'foo' }
type Bar = { bar: 'bar' }
type Baz = { baz: 'baz' }

type Result = Mapper<[(arg: number) => Foo, (arg: Foo) => Bar, (arg: Bar) => Baz]> // Foo & Bar & Baz

export interface TestFunction<Ctx> {
  <A>(
    conditions: [(context: Ctx) => A],
    body: (context: A) => any
  ): any

  <A, B, C extends ReadonlyArray<any>>(
    conditions: C,
    body: (context: Mapper<C, Ctx>) => void
  ): any
}

const test: TestFunction<{ hello: 'world' }> = () => void 0

function withWorld<Context extends { hello: 'world' }>(context: Context) {
  return { ...context, world: 'hello' }
}

function withSomething<Context extends {}>(context: Context) {
  return { ...context, something: 'else' }
}

function withSomethingElse<Context extends {}>(context: Context) {
  return { ...context, somethingElse: 'smth else' }
}

test([withSomething], (_context) => void 0)
test([withWorld], (_context) => void 0)
test([withWorld, withSomething, withSomethingElse] as const, (_context) => void 0)

这里你可以找到其他你可能感兴趣的例子

Here you can find other examples wich might be interesting for you

可变和不可变数组

const mutable1 = [1, 2] // number[]

const mutable2 = [{ age: 1 }, { name: 'John' }]

type MutableLength = (typeof mutable2)['length'] // number, we don't know the length

// const mutable2: ({
//     age: number;
//     name?: undefined;
// } | {
//     name: string;
//     age?: undefined;
// })[]

// As you see, if you want to operate on mutable array, TS will just make a union type from all array customElements

const immutable =  [{ age: 1 }, { name: 'John' }] as const

type ImmutableLength = (typeof immutable)['length'] // length is 2, we know exactly the length of array and the type of all elements

// Here, TS is able to say that your array has exact two elements

更新，我希望是最后一个 :D

我的错，我认为用可变数组是不可能的，但我应该从不同的角度看问题.

My bad, I thought it is impossible to make it with mutable arrays, but I just should have to take a look on the problem from different angle.

这是可行的解决方案:

type Fn = (...args: any[]) => any

// credits goes https://stackoverflow.com/questions/50374908/transform-union-type-to-intersection-type/50375286#50375286
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
  k: infer I
) => void
  ? I
  : never;

export interface TestFunction<Ctx> {
  <A>(
    conditions: [(context: Ctx) => A],
    body: (context: A) => any
  ): any

  <C extends Array<Fn>>(
    conditions: C,
    body: (context: UnionToIntersection<ReturnType<C[number]>>) => void
  ): any
}

const test: TestFunction<{ hello: 'world' }> = () => void 0


function withWorld<Context extends { hello: 'world' }>(context: Context) {
  return { ...context, world: 'hello' }
}

function withSomething<Context extends {}>(context: Context) {
  return { ...context, something: 'else' }
}

function withSomethingElse<Context extends {}>(context: Context) {
  return { ...context, somethingElse: 'smth else' }
}

test([withSomething], (_context) => void 0)
test([withWorld], (_context) => void 0)
test([withWorld, withSomething, withSomethingElse], (_context) => void 0)

这篇关于无法使 TypeScript 泛型链正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！