TypeScript函数类型

在 TypeScript 中,函数类型是一项强大的特性,它不仅可以增强代码的可读性和可维护性,还能提供更严格的类型检查,减少潜在的运行时错误。本文将深入探讨 TypeScript 中函数类型的各个方面,包括以下几个方面:

1.函数定义类型和返回值 、箭头函数定义类型和返回值

// TypeScript定义函数
function add(a:number,b:number){
    return a+b
}
console.log(add(1,2))
// TypeScript通过箭头函数定义函数,指定函数的返回类型为number
const add1 = (a:number,b:number):number =>a+b
console.log(add1(1,3))

此时,add 函数的类型被明确指定为接收两个参数,类型为 number,并返回一个 number 类型的值。

2.传入默认值

//给函数参数设置默认值及可选参数
function add2(a:number =10,b?:number){
    return a+b
}

这里,add1 是一个箭头函数,它的类型也被指定为接收两个 number 类型的参数,返回值为 number

3.将对象作为参数传递给函数

通过接口定义对象,可以将对象作为参数传递给函数:

// 通过interface定义一个对象,然后将对象作为参数传递给函数
interface Person1{
    name:string,
    age:number

}
// @ts-ignore
function printPerson(person:Person1):Person1{
    console.log(person.name,person.age)
}

printPerson({name:"小明",age:18})

4.函数this类型

// 函数this类型
interface Obj{
    name:string,
    //this指向Obj
    printName(this:Obj,name:string):void
}
let obj1:Obj={
    name:"小明",
    //this指向obj1
    printName(this: Obj, name: string) {
        console.log(name)
    }
}
obj1.printName("小兰")

5.函数重载

// 函数重载 根据参数类型确定调用的具体函数
let user:number[] = [1,2,3]

function findNum(add:number[]):number[];
function findNum(id:number):number[];
//没有查询具体id,返回所有数据
function findNum():number[]
function findNum(ids?:number | number[]):number[] {
    if (typeof ids === "number") {
        return user.filter((item, index) => {
            return item === ids
        })

    }
    else if(Array.isArray(ids)){
        user.push(...ids)
        return user
    }else{
        return user
    }
}

console.log(findNum([4,5,6,7,8]))

  • 9
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值