1、函数接口
interface IFn{
(a:number):void;
}
var fn:IFn=function(a){
}
详细讲解
2、参数也是一个函数的接口
a是一个数值,f是一个回调函数 有一个参数，并且参数是数值，返回一个数值结果
interface IFn{
// f:(a:number)=>number :=>number 代表了回调函数返回值
(a:number,f:(a:number)=>number):number//代表了总函数的返回值
}
interface IFn1{
(a:number):number;
}
interface IFn2{
(a:number,f:IFn1):number;
}
var fn:IFn2=(a,f)=>{
if(a>5){
return f(a);
}else{
a-=5;
return f(a)
}
}
3、函数返回Promose对象
interface IFn{
(time:number):Promise<number>
}
Promise<>中的类型是Promise中resolve返回结果的类型
var delay:IFn=function(time){
return new Promise(function(resolve:(n:number)=>void,reject:()=>void){
setTimeout(function(){
resolve(10);
},time)
})
}
interface ILoadImage{
(src:string):Promise<HTMLImageElement>
}
var loadImage:ILoadImage=src=>new Promise((resolve:
(n:HTMLImageElement)=>void,reject:(a:string)=>void)=>{
var img=new Image();
img.src=src;
img.onload=e=>{
resolve(img);
}
img.onerror=e=>{
reject(src)
}
})
4、async函数的接口
interface IF{
(time:number):Promise<void>
}
var fn:IF=async (time)=>{
var a:number=await delay(time).catch(e=>{}) as number;
console.log(a);
}
fn(1000)
interface IFn{
(time:number):Promise<number>
}
var delay:IFn=function(time){
return new Promise(function(resolve:(n:number)=>void,reject:()=>void){
setTimeout(function(){
resolve(10)
},time)
})
}
5、多样性的函数接口
1)、全必填参数
interface IFn1{
(a:number,b:number,c:number):void;
}
2）、选填参数
interface IFn2 {
(a: number, b: number, c?: number): void;
}
3）、包含属性的函数
interface IFn5{
(a:number,b:number,c?:number):void;
num:number;
}
// 这种复合型的函数，需要开始使用断言
var fn:IFn5=<IFn5>((a,b,c)=>{
})
fn.num=10
4）、剩余参数的接口
interface IFn3{
(a:number,b:number,...arg:Array<number>):void
}
5）、使用元组的参数接口
如果arg使用元组类型，意味着这个函数参数是一个固定的参数项
interface IFn4{
(a:number,b:number,...arg:[string,number,string]):void;
}
var fn:IFn4=(a,b,...arg)=>{
console.log(a,b,arg);//1,2, ['a', 2, 'd']
}
fn(1,2,"a",2,"d")
6）、使用元组统一设定参数类型，可以避免对于函数中参数名的不同
interface IFn{
(...arg:[number,string,number,number,string]):void
}
var fn:IFn=(a,b,c,d,e)=>{
}
var fn1:IFn=(num1,str1,num2,num3,str2)=>{
}
