【问题标题】:TypeScript typeof Function return valueTypeScript typeof 函数返回值
【发布时间】:2019-02-19 16:30:42
【问题描述】:

承认我有这样的功能

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

我如何在声明createPerson之前不声明接口或类型,获取返回值类型?

类似这样的:

type Person = typeof createPerson()

示例场景

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

containers/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)

components/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>
)

我希望能够导出mapDispatchToProps的类型,而不必创建MappedDispatch接口。

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

【问题讨论】:

  • 为什么?重点是什么?你能添加一个有意义的场景吗?
  • @NitzanTomer 我编辑了我的问题以添加一个具体的场景。
  • 我认为你做不到。无法根据函数返回值的类型来定义类型。

标签: typescript


【解决方案1】:

原帖

打字稿

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

https://npmjs.com/package/returnof

还在 Github 上创建了一个问题,要求 Generic Types Inference,这将允许以完全声明的方式来执行此操作:

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>

【讨论】:

  • 使用类时如何获取方法的返回类型?我不能使用ReturnType&lt;typeof this.methodName&gt;
  • @IvánSánchez 对于 Animal 类,您可以在类方法中使用 ReturnType&lt;Animal['methodName']&gt;ReturnType&lt;this['methodName']&gt;
  • 并获取静态方法的ReturnType:ReturnType&lt;(typeof Animal)['methodName']&gt;
  • 只是想跳进去说哇。这是相当惊人的。我只是在寻找是否有办法实现这一目标,但我真的没有任何希望。很高兴找到这个问题和答案。干杯!
  • 感觉和@bobmoff 一样,TypeScript 总是让我惊叹。
【解决方案2】:

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

let r = true ? undefined : someFunction();
type ReturnType = typeof r;

【讨论】:

  • RerturnType 中的错字
  • 是的...从链接复制/粘贴而不检查。谢谢。
  • 通过最近的严格空检查,以下内容避免了 (undefined | ...) 部分:` let r = true ? (未定义为从不):someFunction();类型 ReturnType = typeof r; `
【解决方案3】:

改编自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

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

最好的部分是作为参数提供给fakeReturn 的函数实际上并未被调用。

使用 TypeScript 2.5.3 测试


TypeScript 2.8 引入了一些预定义的条件类型,包括获取函数类型返回类型的ReturnType&lt;T&gt;

const hello = () => 'World'

type Hello = ReturnType<typeof hello> // string

【讨论】:

    猜你喜欢
    • 2017-07-16
    • 2018-06-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-03-28
    • 2022-11-11
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多