在ts中也可以写js,他们两个的区别就是在写ts时需要给形参还有函数的返回值添加类型

基本写法

普通函数

function say(name:string,age:number):string{
    return name+'今年'+age+'岁'
}
console.log(say('wangcai',100))

函数表达式

let say = function(name:string,age:number):string{
    return name+'今年'+age+'岁'
}
console.log(say('wangcai',100))

函数类型

可以为函数定义类型有以下两种方法

第一种定义好类型把类型赋给函数

type mySay = (name:string,age:number) => string
let say:mySay = function(name,age){
    return name+'今年'+age+'岁'
}
console.log(say('wangcai',100))

第二种

let mySay:(name:string,age:number)=>string = function(name,age){
    return name+'今年'+age+'岁'
}
console.log(mySay('wangcai',100))

你会发现如果你在定义函数类型时指定了类型，但是在函数那里没有类型，也不会报错，因为TypeScript编译器会自动识别出类型：

可选参数

当调用函数时，有时不想传入参数，但是在声明函数时说需要传而不传的话，会报错，这时可以使用可选参数，在不像传入的参数后面加?:,不传的话会默认为undefined，而且必须把可选把参数放到形参的最后面

function say(name:string,age?:number):string{
    return name+'今年'+age+'岁'
}
console.log(say('wangcai')) //可以不传
console.log(say('wangcai',100)) //可以传

name为可选参数时必须把它放到age后面

function say(age:number,name?:string):string{
    return name+'今年'+age+'岁'
}
console.log(say(100))

默认参数

它类似于可选参数，在调用时对于已经有默认值的参数可以传也可以不传，但是它不需要把默认的参数放到形参的最后面，但是如果在前面的话，在调用时必须传入一个undefined,输出的话还是默认的值

默认参数在前面

function say(name:string='wangcai',age:number):void{
    console.log(name+'今年'+age+'岁')
}
// say(100) //会报错
say(undefined,100) //不会报错 wangcai今年100岁
say('xiaoqiang',200) //xiaoqiang今年200岁
//也可以在调用时 进行传参 这是会根据传的为主

默认参数在最后面

function say(name:string,age:number=100):void{
    console.log(name+'今年'+age+'岁')
}
say('wangcai') //wangcai今年100岁
say('xiaoqiang',200) //xiaoqiang今年200岁
//也可以在调用时 进行传参 这是会根据传的为主

剩余参数

因为在调用这个函数时不知道传入几个实参时可以使用...

function num(...numbers):void{
    console.log(numbers)  //[1,2,3,4,5]
}
num(1,2,3,4,5)

函数重载

方法是为同一个函数提供多个函数类型定义来进行函数重载。编译器会根据这个列表去处理函数的调用。

let obj = {name:'wangcai',age:100}
function arr(val:string):void
function arr(val:number):void
function arr(val:any){
    if(typeof val === 'string'){
        obj.name = val
    }else if(typeof val === 'number'){
        obj.age = val
    }
    
}
arr('xiaoqiang')
console.log(obj)  //{ name: 'xiaoqiang', age: 100 }
arr(200)
console.log(obj)  //{ name: 'xiaoqiang', age: 200 }

上面有两个重载，一个是接收数字，一个是接收字符串，通过any里面的逻辑实现函数

ts之函数部分