在 Typescript 中推断函数返回类型

2023-11-29 21:48:53 浏览数 (1)

情景

你正在使用名为 funky-lib 的库中的 doFunkyStuff 函数。doFunkyStuff 返回一个名为 FunkyStuff 的接口,但是 funky-lib 并没有导出 FunkyStuff

库中的代码

代码语言:typescript复制
// node_modules/funcky-lib/index.ts

interface FunkyStuff {
    message: string,
    funkinessLevel: number
}

export function doFunkyStuff(): FunkyStuff {
   console.log('doing funky stuff')

   return { 
      message: 'did some funky stuff',
      funkinessLevel: Math.random(),
   }
}

我们的代码

代码语言:typescript复制
// index.ts
import { doFunkyStuff } from 'funky-stuff'

// eslint 提示 no-explicit-any
function repeatFunkyStuff(fStuff: any) {
  console.log('repeating funky stuff', fStuff)

  return {...fStuff}
}

repeatFunkyStuff(doFunkyStuff)

根据你的 eslint-config,eslint 可能会提示 "no-implicit-any" 或 "no-explicit-any"。

不好的解决方案

重新定义 FunkyStuff

代码语言:typescript复制
function repeatFunkyStuff(fStuff: { message: string; funkinessLevel: number})

上述解决方案不好,因为如果 FunkyStuff 有很多属性,那么代码会变得难以阅读。

而且,每当 FunkyStuff 发生变化时,我们就必须更新我们的代码。

好的解决方案

使用 ReturnType 实用程序类型。

代码语言:typescript复制
// index.ts 中的我们的代码
...
type AppFunkyStuff = ReturnType<typeof doFunkyStuff>

function repeatFunkyStuff(fStuff: AppFunkyStuff) {
   ...
}
...

额外信息

你可以将 ReturnType<T> 与 Awaited<T> 实用程序类型结合使用,用于返回承诺的函数。

假设 doFunkyStuff 返回一个 Promise,则 AppFunkyStuff 可以这样定义。

代码语言:typescript复制
type AppFunkyStuff = Awaited<ReturnType<typeof doFunkyStuff>>

⚠️ Awaited 实用程序仅在 typescript 4.5 中才可用。在之前的版本中,实现相同效果可能有些棘手。

总结

这个提示只是 TypeScript 提供的众多功能中的冰山一角。

It seems you'd like the provided content translated. Here is the translation:


情景

你正在使用名为 funky-lib 的库中的 doFunkyStuff 函数。doFunkyStuff 返回一个名为 FunkyStuff 的接口,但是 funky-lib 并没有导出 FunkyStuff

库中的代码

代码语言:typescript复制
// node_modules/funcky-lib/index.ts

interface FunkyStuff {
    message: string,
    funkinessLevel: number
}

export function doFunkyStuff(): FunkyStuff {
   console.log('doing funky stuff')

   return { 
      message: 'did some funky stuff',
      funkinessLevel: Math.random(),
   }
}

我们的代码

代码语言:typescript复制
// index.ts
import { doFunkyStuff } from 'funky-stuff'

// eslint 提示 no-explicit-any
function repeatFunkyStuff(fStuff: any) {
  console.log('repeating funky stuff', fStuff)

  return {...fStuff}
}

repeatFunkyStuff(doFunkyStuff)

根据你的 eslint-config,eslint 可能会提示 "no-implicit-any" 或 "no-explicit-any"。

不好的解决方案

重新定义 FunkyStuff

代码语言:typescript复制
function repeatFunkyStuff(fStuff: { message: string; funkinessLevel: number})

上述解决方案不好,因为如果 FunkyStuff 有很多属性,那么代码会变得难以阅读。

而且,每当 FunkyStuff 发生变化时,我们就必须更新我们的代码。

好的解决方案

使用 ReturnType 实用程序类型。

代码语言:typescript复制
// index.ts 中的我们的代码
...
type AppFunkyStuff = ReturnType<typeof doFunkyStuff>

function repeatFunkyStuff(fStuff: AppFunkyStuff) {
   ...
}
...

额外信息

你可以将 ReturnType<T> 与 Awaited<T> 实用程序类型结合使用,用于返回承诺的函数。

假设 doFunkyStuff 返回一个 Promise,则 AppFunkyStuff 可以这样定义。

代码语言:typescript复制
type AppFunkyStuff = Awaited<ReturnType<typeof doFunkyStuff>>

⚠️ Awaited 实用程序仅在 typescript 4.5 中才可用。在之前的版本中,实现相同效果可能有些棘手。

总结

这个提示只是 TypeScript 提供的众多功能中的冰山一角。

It seems you'd like the provided content translated. Here is the translation:


情景

你正在使用名为 funky-lib 的库中的 doFunkyStuff 函数。doFunkyStuff 返回一个名为 FunkyStuff 的接口,但是 funky-lib 并没有导出 FunkyStuff

库中的代码

代码语言:typescript复制
// node_modules/funcky-lib/index.ts

interface FunkyStuff {
    message: string,
    funkinessLevel: number
}

export function doFunkyStuff(): FunkyStuff {
   console.log('doing funky stuff')

   return { 
      message: 'did some funky stuff',
      funkinessLevel: Math.random(),
   }
}

我们的代码

代码语言:typescript复制
// index.ts
import { doFunkyStuff } from 'funky-stuff'

// eslint 提示 no-explicit-any
function repeatFunkyStuff(fStuff: any) {
  console.log('repeating funky stuff', fStuff)

  return {...fStuff}
}

repeatFunkyStuff(doFunkyStuff)

根据你的 eslint-config,eslint 可能会提示 "no-implicit-any" 或 "no-explicit-any"。

不好的解决方案

重新定义 FunkyStuff

代码语言:typescript复制
function repeatFunkyStuff(fStuff: { message: string; funkinessLevel: number})

上述解决方案不好,因为如果 FunkyStuff 有很多属性,那么代码会变得难以阅读。

而且,每当 FunkyStuff 发生变化时,我们就必须更新我们的代码。

好的解决方案

使用 ReturnType 实用程序类型。

代码语言:typescript复制
// index.ts 中的我们的代码
...
type AppFunkyStuff = ReturnType<typeof doFunkyStuff>

function repeatFunkyStuff(fStuff: AppFunkyStuff) {
   ...
}
...

额外信息

你可以将 ReturnType<T> 与 Awaited<T> 实用程序类型结合使用,用于返回承诺的函数。

假设 doFunkyStuff 返回一个 Promise,则 AppFunkyStuff 可以这样定义。

代码语言:typescript复制
type AppFunkyStuff = Awaited<ReturnType<typeof doFunkyStuff>>

⚠️ Awaited 实用程序仅在 typescript 4.5 中才可用。在之前的版本中,实现相同效果可能有些棘手。

总结

这个提示只是 TypeScript 提供的众多功能中的冰山一角。

我正在参与2023腾讯技术创作特训营第三期有奖征文,组队打卡瓜分大奖!

0 人点赞