TypeScript typeof函数返回值

kub*_*ube 27 typescript

承认我有这样的功能

const createPerson = () => ({ firstName: 'John', lastName: 'Doe' })
Run Code Online (Sandbox Code Playgroud)

如果在声明之前没有声明接口或类型,我怎么能createPerson得到返回值类型?

像这样的东西:

type Person = typeof createPerson()
Run Code Online (Sandbox Code Playgroud)

示例场景

我有一个Redux容器,它将状态和调度操作映射到组件的props.

集装箱/ Counter.tsx

import { CounterState } from 'reducers/counter'

// ... Here I also defined MappedState and mapStateToProps

// The interface I would like to remove
interface MappedDispatch {
  increment: () => any
}

// And get the return value type of this function
const mapDispatchToProps =
  (dispatch: Dispatch<State>): MappedDispatch => ({
    increment: () => dispatch(increment)
  })

// To export it here instead of MappedDispatch
export type MappedProps = MappedState & MappedDispatch
export default connect(mapStateToProps, mapDispatchToProps)(Counter)
Run Code Online (Sandbox Code Playgroud)

组件/ Counter.tsx

import { MappedProps } from 'containers/Counter'

export default (props: MappedProps) => (
  <div>
    <h1>Counter</h1>
    <p>{props.value}</p>
    <button onClick={props.increment}>+</button>
  </div>
)
Run Code Online (Sandbox Code Playgroud)

我希望能够导出类型而mapDispatchToProps无需创建MappedDispatch接口.

我在这里减少了代码,但它让我输入两次相同的东西.

kub*_*ube 48

原帖

TypeScript <2.8

我创建了一个允许解决方法的小库,直到将一个完全声明的方式添加到TypeScript:

https://npmjs.com/package/returnof

还在Github上创建了一个问题,要求进行通用类型推断,这将允许完全声明性的方式来执行此操作:

https://github.com/Microsoft/TypeScript/issues/14400


2018年2月更新

TypeScript 2.8

TypeScript 2.8引入了一种新的静态类型ReturnType,允许实现:

https://github.com/Microsoft/TypeScript/pull/21496

您现在可以以完全声明的方式轻松获取函数的返回类型:

const createPerson = () => ({
  firstName: 'John',
  lastName: 'Doe'
})

type Person = ReturnType<typeof createPerson>
Run Code Online (Sandbox Code Playgroud)

  • 使用类时如何获取方法的返回类型?我不能使用`ReturnType&lt;typeof this.methodName&gt;` (2认同)
  • @IvánSánchez对于动物类,您可以在类方法内执行`ReturnType &lt;Animal ['methodName']&gt;`或`ReturnType &lt;this ['methodName']&gt;`。 (2认同)
  • 并获得*静态方法*的ReturnType:`ReturnType &lt;(动物的类型)['方法名称']&gt;` (2认同)

0x6*_*015 13

https://github.com/Microsoft/TypeScript/issues/4233#issuecomment-139978012可能会有所帮助:

let r = true ? undefined : someFunction();
type ReturnType = typeof r;
Run Code Online (Sandbox Code Playgroud)

  • 使用最近的严格null检查,以下避免了(undefined | ...)部分:`let r = true?(undefined as never):someFunction(); type ReturnType = typeof r; ` (5认同)

Mih*_*anu 9

改编自https://github.com/Microsoft/TypeScript/issues/14400#issuecomment-291261491

const fakeReturn = <T>(fn: () => T) => ({} as T)

const hello = () => 'World'
const helloReturn = fakeReturn(hello) // {}

type Hello = typeof helloReturn // string
Run Code Online (Sandbox Code Playgroud)

链接中的示例使用null as T而不是{} as T,但打破了Type 'null' cannot be converted to type 'T'.

最好的部分是fakeReturn实际上没有调用作为参数给出的函数.

使用TypeScript 2.5.3进行测试


TypeScript 2.8引入了一些预定义的条件类型,包括ReturnType<T>获取函数类型的返回类型.

const hello = () => 'World'

type Hello = ReturnType<typeof hello> // string
Run Code Online (Sandbox Code Playgroud)