当前位置: 首页 > Web前端 > JavaScript

[TS]函数重载--可选参数--默认参数

时间:2023-03-27 13:20:07 JavaScript

可选参数--默认参数为ts中定义的数据类型。在某些情况下,只需要传入定义数据类型的部分参数,如:id,name,age,address,如果此时需要修改用户名,那么只需要传入身份证件和姓名;某些情况下,需要修改用户的所有信息,需要传入所有参数;你可以定义两个接口分别接收它们,但也可以通过在这里定义一个接口来完成,这里使用可选参数和默认参数。Syntax:attributename?:datatype=value//lastName?:string//syntax?:可选参数,可以传const也可以不传constgetFullName=function(firstName:string='Oriental',lastName?:string):string{if(lastName){return`${firstName},${lastName}`}returnfirstName}//调用函数不传参,使用默认参数,第二个为可选参数,可以不传console.log(getFullName());//调用函数,只传一个,firstName会收到传入值'IntroductiontoArt'console.log(getFullName('IntroductiontoArt'));//调用函数,传入两个参数,对应firstName和lastNameconsole.log(getFullName('Art','Introduction'));打印结果。带?:的数据类型是一个可选参数,可以传递也可以不传递。函数重载在调用函数时,可以在参数上定义需要接收的数据类型,但是如果这个函数需要在不同的场合使用,定义一套数据类型规范显然是不够的,所以你可以使用这里的函数Overloading,可以在此基础上重新定义数据类型。//函数的参数可以传入x和y,都可以是字符串或者数字函数的返回值也可以是字符串或者数字functionadd(x:string|number,y:string|数字):字符串|number{//但内部有限制,x和y只能是字符串或数字if(typeofx==='string'&&typeofy==='string'){returnx+y}elseif(typeofx==='number'&&typeofy==='number'){returnx+y}return'notfound'}在这种情况下,虽然定义的参数x和y可以同时传递数字和String,但是x传递的是一个字符串和y传递的是一个数字,显然是符合函数参数的数据规范的,但是在函数内部,检查了传入值的数据类型,所以这时候只能用在传递参数的时候,数据类型是指定的。这里已经标准化了。在不改变原有函数类型的基础上,可以通过函数重载来重新定义函数的参数类型。//函数重载声明functionadd(x:string,y:string):string//传入x,y只能是字符串返回也是字符串functionadd(x:number,y:number):number//输入x和y只能是数字,返回也是数字。此时传入的x和y只能是数字,也只能是字符串。//这两个输入都没有问题console.log(add('Orient','Unbeaten'));控制台日志(添加(100,200));注意:函数重载后,重载的数据类型会覆盖函数原来的数据类型约束,然后按照原来的一些数据类型作为参数传入,会报错。但是,可以随意使用重载数据类型,而不考虑顺序。console.log(add('东方','不败'));//字符串console.log(add(100,200));//数字console.log(add('东方','不败'));//String关于函数和函数类型请看另一篇文章:【TS】函数和函数类型案例源码:https://gitee.com/wang_fan_w/ts-seminar如果您觉得本文对您有帮助,欢迎关注点亮星星