TypeScript 中，如何定义（声明）函数的类型？

[Kasumi20]

我知道可以把函数写成变量，就可以声明函数的类型了，比如这里的 Root 组件：

import * as React from 'react';

var Root: React.FC = (props: React.PropsWithChildren<{}>) => {
    return (
        <div>
            {props.children}
        </div>
    )
}

export default () => (
    < >
        <Root>
            <div>Hello</div>
        </Root>
    </>
)

但是太丑了，该怎么写呢？

function Root(props) {
}

[Yadomin]

`function Root(props): React.FC {}`

[Kasumi20]

@Yadomin 大哥，你这是定义返回类型

[Yadomin]

也可以写成
const Root = (props): React.FC => {}

[meepo3927]

函数有类型吗

[knives]

是指 props 的类型定义？可参考： https://juejin.cn/post/6884144754993397767

[Kasumi20]

@meepo3927 这句话问得很哲学，我喜欢

[Justin13]

interface 里的 function types 可以做到

[BBUG]

不行

明确一点，`var Root: React.FC = () => {}` 等号右边的函数声明隐式包含一个类型，左边变量类型相当于是对右边函数类型的一个约束

一般推荐使用常规函数声明组件即可，不需要使用 React.FC
https://github.com/typescript-cheatsheets/react/blob/main/README.md#function-components

[iamppz]

```
const func: () => void = function () {
...
};
```

是这个意思？

[hupo0]

``` typescript
interface Root {
(props: React.PropsWithChildren<{}>): React.FC;
}
```

[learningman]

函数的类型不就是函数，你想说的是返回值？

[Reapper]

函数就是类型，除非你说返回值类型

[yazoox]

这个 Root 的类型，就是 React.FC, 返回值是 React.Element<any, any> | null

[lanten]

其实函数类型的定义就是行参和返回值类型定义，可以直接用 typeof 推断。

```ts
function foo(strArr: string[]): string {
return strArr.join(',')
}

type Foo = typeof foo

```

也可以用 interface 定义函数类型'

```ts
interface F {
(strArr: string[]): string
}

const fn: F = strArr => {
return strArr.join(',')
}
```

[1a0ma0]

interface 不是可以定义嘛？

[siweipancc]

……，你先回答我官网文档你看完了吗 :D

[Kasumi20]

@siweipancc 你先回答我你看完我问题了吗？

[ljpCN]

14 楼正解。
```typescript
function fn(arg: string): string {
return arg;
}
```

[palmers]

我知道的可以使用函数声明（ Function Declaration ）和函数表达式（ Function Expression ）
具体可以参考这个: https://www.typescriptlang.org/docs/handbook/interfaces.html#function-types

[coffeedeveloper]

楼上认为能申明的都是没了解实际问题的，这个问题我也困扰过。目前确实是无解的。

比如我想申明一个函数的类型申明，有 x 、y 两个 number 参数，返回一个 number 。可以用 interface

```typescript
interface NumFn {
(x: number, b: number): number
}
```

随后希望 `function Foo` 和`function Bar`都能够基于 NumFn 这个 interface 约定来实现的话，目前确实是没法弄的，只能通过 `const foo = `来勉强达到目的。