TypeScript学习(二)—— 函数

前篇:TypeScript学习(一)—— 数据类型数组

在TS中,函数也和es中有些许不一样。咱们能够去指定形参的类型,也能够去指定函数的返回类型。接下来咱们就来看下TS中的函数。函数

函数的定义

function Fn():string { //定义返回值为string类型的函数
    const str:string = '22222'
    return str
}
function Fn1(name:string, age:number):string { //对形参类型进行约束
    return name + age
}
Fn1('mimi', 6) //不报错
Fn1(44, 6) //类型不对编译器报错
Fn1('wumi') //报错

//可选参数
function Fn2(name:string, age?:number):string { //加?为可选参数,能够传能够不传,可选参数必须配置到参数的最后面
    return name + age
}
Fn2('xixixi') //不报错


//默认参数
function Fn(name:string, age:number = 2):string { //给形参一个默认值,若是不传age就为默认的2
    return name + age
}
console.log(Fn('咪咪', 3)) //=>咪咪3
console.log(Fn('咪咪')) //=》咪咪2

//剩余参数
function sum(...result:number[]):number { //...为剩余元素运算符,把传进来的参数都放入result数组中
    return result.reduce((x, y) => x + y)
}
console.log(sum(1,2,3,4,5))
复制代码

函数的重载

TS中函数的重载,经过为同一个函数提供多个函数类型定义来实现多种功能的目的post

//参数类型不一样的重载
function User(name:string):string;
function User(age:number):number;
function User(str:any):any{
    if(typeof str === 'string'){
        return '我是name:' + str
    }else {
        return '我是age:' + str
    }
}

User('wumi') //=>我是name:wumi
User(true)  //=>报错,没有布尔类型的重载

//参数个数不一样的重载
function User1(name:string):string function User1(name:string, age:number):string function User1(name:any, age?:any):any{ if(age){ return '我是' + name + ',age:' + age }else {
        return "我是" + name
    }
}
console.log(User1('阿旺',2))  //我是阿旺,age:2
console.log(User1('阿旺'))    //我是阿旺
复制代码
相关文章
相关标签/搜索