我知道可以把函数写成变量,就可以声明函数的类型了,比如这里的 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) {
}
结论:目前只能使用这种丑陋的方式了,这是js历史遗留。
要优雅的类型,还得完全面对对象。
关于什么是函数类型,这里提示一下
type FC = (props: string) => number;
export default ((a) => {
// 很好:a被推导为string类型
// 不好:没有返回正确的类型,编译器不报异常
}) as FC;
1
Yadomin 2021-02-03 17:04:25 +08:00 via Android
`function Root(props): React.FC {}`
|
3
Yadomin 2021-02-03 17:06:20 +08:00 via Android
也可以写成
const Root = (props): React.FC => {} |
4
meepo3927 2021-02-03 17:39:36 +08:00 1
函数有类型吗
|
5
knives 2021-02-03 17:45:39 +08:00
是指 props 的类型定义?可参考: https://juejin.cn/post/6884144754993397767
|
7
Justin13 2021-02-03 17:50:06 +08:00 via Android
interface 里的 function types 可以做到
|
8
BBUG 2021-02-03 17:54:37 +08:00 3
不行
明确一点,`var Root: React.FC = () => {}` 等号右边的函数声明隐式包含一个类型,左边变量类型相当于是对右边函数类型的一个约束 一般推荐使用常规函数声明组件即可,不需要使用 React.FC https://github.com/typescript-cheatsheets/react/blob/main/README.md#function-components |
9
iamppz 2021-02-03 18:25:39 +08:00
```
const func: () => void = function () { ... }; ``` 是这个意思? |
10
hupo0 2021-02-03 18:49:35 +08:00
``` typescript
interface Root { (props: React.PropsWithChildren<{}>): React.FC; } ``` |
11
learningman 2021-02-03 21:49:51 +08:00
函数的类型不就是函数,你想说的是返回值?
|
12
Reapper 2021-02-04 09:08:26 +08:00
函数就是类型,除非你说返回值类型
|
13
yazoox 2021-02-04 09:38:04 +08:00
这个 Root 的类型,就是 React.FC, 返回值是 React.Element<any, any> | null
|
14
lanten 2021-02-04 09:43:53 +08:00
其实函数类型的定义就是行参和返回值类型定义,可以直接用 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(',') } ``` |
15
1a0ma0 2021-02-04 12:22:23 +08:00
interface 不是可以定义嘛?
|
16
siweipancc 2021-02-04 13:43:32 +08:00 via iPhone
……,你先回答我官网文档你看完了吗 :D
|
17
Kasumi20 OP @siweipancc 你先回答我你看完我问题了吗?
|
18
ljpCN 2021-02-04 14:29:15 +08:00
14 楼正解。
```typescript function fn(arg: string): string { return arg; } ``` |
19
palmers 2021-02-04 16:42:41 +08:00 1
我知道的可以使用函数声明( Function Declaration )和函数表达式( Function Expression )
具体可以参考这个: https://www.typescriptlang.org/docs/handbook/interfaces.html#function-types |
20
coffeedeveloper 2021-02-04 20:01:27 +08:00 1
楼上认为能申明的都是没了解实际问题的,这个问题我也困扰过。目前确实是无解的。
比如我想申明一个函数的类型申明,有 x 、y 两个 number 参数,返回一个 number 。可以用 interface ```typescript interface NumFn { (x: number, b: number): number } ``` 随后希望 `function Foo` 和`function Bar`都能够基于 NumFn 这个 interface 约定来实现的话,目前确实是没法弄的,只能通过 `const foo = `来勉强达到目的。 |
21
Sparetire 2021-02-05 01:27:28 +08:00 via Android 1
怎么这么多连问题都没看懂就强答的。。还函数有类型吗都问出来了
楼主是希望在定义函数的同时也声明函数的类型吧,注意是定义函数不是函数表达式(js 里面似乎是这么个叫法吧,有点忘了) 显然楼主是知道函数表达式的时候该如何指定函数类型。。还一堆人搁这接口 typeof 的。。 回到问题,目前 ts 没法做 |