TypeScript交流前端交流Web 前端开发

Typescript中的函数

2020-02-12  本文已影响0人  羽翼的翼

1. 函数表达式

// 指定返回值的类型
console.log('下面是函数部分')
var fun = function():number {
    let a = 1
    return a

}
console.log(fun())
// 1.
// es5里面方法的实参和行参可以不一样,
// 指定形参类型与返回值的类型
// 这种必须上传两个参数 并且参数a是number类型   参数name是string类型
function str1(a:number, name:string):string {
    return a + name
}
console.log(str1(1, '22'), 'str1')

2. 可选参数

// 可选参数 必须设置到最后边
// 但是ts中必须一样,如果不一样就需要配置可选参数

function fun2(a:string, name?:string):string {
    if (name) {
        return a + name

    } else {
        return a + '没有name'
    }
}
console.log(fun2('asf ', '22'), 'fun2')

3 默认函数

function moren(age:number, name:string = '张三') {
    return name + age
}
console.log(moren(18), '不传name,会打印默认值张三')
console.log(moren(18, '那么'), '传name, 会打印传递的name值')

4. 剩余函数

function sum(...s:number[]):number {
    var add = 0
    for (var i = 0; i<s.length; i++) {
        console.log(s[i])
        add = add + s[i]
        console.log(add)
    }
    console.log(add, 'add')
    return add
}
console.log(sum(1,2,3))

function sum2(a:number,b:number,...s:number[]):number {
    var add = a+b
    for (var i = 0; i<s.length; i++) {
        console.log(s[i])
        add = add + s[i]
        console.log(add)
    }
    console.log(add, 'add')
    return add
}
console.log(sum2(1,2,3,4,5))

5 函数重载

// 写法一
function fun3(name:string):string;
function fun3(age:number):number;
function fun3(str:any):any {
    if (typeof str === 'string') {
        return '我的名字是' + str
    } else {
        return '我的年龄是' + str
    }
};

console.log(fun3('臧飒飒'), '进入第一行函数了') // 我的名字是臧飒飒 进入第一行函数了
console.log(fun3(18), '进入第2行函数了') // 我的年龄是18 进入第2行函数了
// console.log(fun3(18, 'afsd'), '进入第2行函数了') // 不执行,编译报错了


// 写法2
function info(name:string):string;

function info(name:string, age:number):string;

function info(a:any, b?:any):any {
    if (b) {
        return a + b
    } else {
        return a 
    }
}
console.log(info('zs', 19)) // zs19

6 箭头函数

setTimeout(() => {
    console.log('箭头函数')
}, 500);
上一篇下一篇

猜你喜欢

热点阅读