在应用函数的时候,通常会给函数传值,或者给函数一个返回值调用,这个时候就会波及到函数类型。
函数类型分为两个方面:
1、函数参数
2、函数返回值
语法: function 函数名( 参数 : 参数类型 ) : 返回值类型 { return 返回值 }
函数有几种不同的写法,别离为:申明函数、匿名函数。
申明函数: 也称为函数申明
、命名函数
,上面是申明函数的写法:
function add ( x : number ,y : number) : number { return x + y } console.log(add(1,2)); // 打印 3
函数add
须要两个参数,x
和y
,并且这两个参数的类型都为数字,且这个函数必须有一个返回值,返回值为number
。 add() : number
这个 number
就是返回值规定的类型。
匿名函数: 也称为匿名函数
,函数表达式
,以表达式的模式出现,写法跟申明函数一样,在括号内规定数据类型,括号里面规定返回值类型。
const add2 = function ( x : number , y : number ) : number { return x + y}console.log(add2(3,3)); // 打印 6
函数add须要两个参数,x
和y
,并且这两个参数的类型都为数字,且这个函数必须有一个返回值,返回值为number。 add() : number
这个 number
就是返回值规定的类型。
无返回值
并不是所有的函数都有返回值,函数能够没有返回值,如果没有返回值,或者返回值为空,在函数()
前面: () : xxx
换成void
即可,void
就是无返回值,写成any
也行,any
能够返回任何类型。
// 无返回值 无返回值应用 void 或 any 即可const emptys = ( params : number) : void => { console.log(params);}emptys(2)
函数类型的残缺写法
const add3 : ( x : number , y : number ) => number = function ( x : number , y : number ) : number { return x + y}console.log(add3(10,10)); // 打印 20
步骤拆解:
1、add3 : ( x : number , y : number ) : number
这里为规定的函数类型,在这个中央定义了后,函数外面传参必须合乎这里定义的规定。传两个参数
,类型为number
,返回值为number
。
2、function ( x : number , y : number ) : number { return x + y }
这里就是给函数传参和函数返回值类型标准,这里的标准必须合乎后面定义的标准,否则报错。
个别不会用这种写法, 比拟繁琐,这里只是举例说明一下。
函数类型应用接口
在函数类型传参中,既然在传参这里规定了数据类型,间接写在函数体上比便于浏览,看起来简单且长,所以能够应用接口来优化代码,使浏览起来更加简洁。
// 定义接口interface IPerson { username : string age : number}const person = (data : IPerson) : string => { return `姓名:${data.username},年龄:${data.age}`}
在person
函数中,传入的值必须是合乎 IPerson
接口的标准,函数必须有返回值,返回值为 string
类型
// 参数let obj = { username : '东方不败', age : 18}console.log(person(obj)); // 打印 姓名:东方不败,年龄:18
另外,接口是能够继承的,也就是说能够将多个接口组装成一个新的接口,在函数类型中应用这个接口,来大大减少类型标准方面的代码量。对于接口继承方面,请看另一篇【TS】接口和接口继承。
案例源码:https://gitee.com/wang_fan_w/ts-seminar
如果感觉这篇文章对你有帮忙,欢送点亮一下star