03-函数类型

Ts函数的类型声明方法
Ts对于函数的参数也会有参数类型检测和参数数量的检测,还能检测函数的返回值类型
function fn(a:number,b:number):number{
    return a+b
}

在参数后面加类型代表函数的参数必须具备这个类型的值,在函数()后面加类型,代表函数的返回值必须是这个类型的值,不然会报错

函数类型的可选参数语法,经常遇到函数的参数数量不确定的情况,这种情况就可以用可选参数的语法

function(a:number,b?:string){
    return a+b
}

这样可以做到函数实际参数较少时不报错

函数的重载

由于 JavaScript 是一个动态语言,我们通常会使用不同类型的参数来调用同一个函数,该函数会根据不同的参数而返回不同的类型的调用结果:

function add(x, y) {
 return x + y;
}
add(1, 2); // 3
add("1", "2"); //"12"

由于 TypeScript 是 JavaScript 的超集,因此以上的代码可以直接在 TypeScript 中使用,但当 TypeScript 编译器开启 noImplicitAny(不允许any类型隐式赋值) 的配置项时,以上代码会提示以下错误信息:

Parameter 'x' implicitly has an 'any' type.
Parameter 'y' implicitly has an 'any' type.

为了解决这个问题,我们可以为参数设置一个类型。因为我们希望 add 函数同时支持 string 和 number 类型,因此我们可以定义一个 string | number 联合类型,同时我们为该联合类型取个别名

type Combinable = string | number;
function add(a: Combinable, b: Combinable) {
    if (typeof a === 'string' || typeof b === 'string') {
     return a.toString() + b.toString();
    }
    return a + b;
}

你以为就此完结了?no!no!no!太年轻了,还没完,有没有想过如果add(1,‘2’)的情况下,函数会有一个怎样的执行结果

Property 'split' does not exist on type 'number'.

对的,因为split是字符串方法,会把字符串分割成数组,数字类型是肯定不能使用的,那如何解决呢?这时我们就可以利用 TypeScript 提供的函数重载特性。

函数重载或方法重载是使用相同名称和不同参数数量或类型创建多个方法的一种能力。 要解决前面遇到的问题,方法就是为同一个函数提供多个函数类型定义来进行函数重载,编译器会根据这个列表去处理函数的调用。
type Types = number | string
function add(a:number,b:number):number;
function add(a: string, b: string): string;
function add(a: string, b: number): string;
function add(a: number, b: string): string;
function add(a:Types, b:Types) {
  if (typeof a === 'string' || typeof b === 'string') {
    return a.toString() + b.toString();
  }
  return a + b;
}
const result = add('Semlinker', ' Kakuqo');
result.split(' ');
可以用 | 来连接多个类型 ,称为 联合类型 (js用 || 来表示或)
let a : number | string
当然,有或就有与,ts可以用 & 来表示与

但是&对于我们的类型定义有啥子用处捏?
难道可以这样
let a : numer&string ,a可以满足既是number类型又是string类型?怎么可能…

所以这个 & 一般用于定义对象的多个属性,比如定义对象的时候
let j :{name:'lzb'} & {age:number}
j={name:'lzb',age:1}
j={name:'lzb'}  //报错,必须同时具备name和age两个属性

累吗,舒服是留给死人的。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

有趣的小良

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值