TS-函数内容

函数类型

一 函数说明法

function run(): void {
    console.log('run');
}

二 匿名函数

let fun = function(): number {
    return 1;
}
console.log(fun()); // 1

三 定义方法传参

function getInfo(name: string, age: number): string {
    return `${name}同学刚刚${age}岁`;
}
console.log(getInfo('张三', 18)); // 张三同学刚刚18岁

四 匿名函数传参

let getName = function(name: string): string {
    return `${name}同学你好`;
}
console.log(getName('李四')); // 李四同学你好

五 没有返回值传参

function runing(name1: string, name2: string): void {
    console.log(`${name1}和${name2}一起跑步`);
}
runing('王五','刘六'); // 王五和刘六一起跑步

传参

一 可选参数

• 可选参数使用 ? 表示

注：可选参数的位置，只能位于参数的最后面

function getUserInfo(name: string, age?: number): string {
    let str: string;
    if (age) {
        str = `${name}同学，今年刚刚${age}岁`;
    } else {
        str = `${name}同学，年龄保密`;
    }
    return str;
}
console.log(getUserInfo('王苏', 19)); // 王苏同学，今年刚刚19岁
console.log(getUserInfo('苏王')); // 苏王同学，年龄保密

二 默认参数

默认参数是可选参数的一种

function getStudentInfo(name: string, age: number = 18): string {
    return `${name}同学，今年刚刚${age}岁`;
}
console.log(getStudentInfo('王苏', 19)); // 王苏同学，今年刚刚19岁
console.log(getStudentInfo('苏王')); // 苏王同学，今年刚刚18岁

三 剩余参数

// 知道参数的个数
function getNum(a: number, b: number, c: number, d:number, e: number): number {
    return a+b+c+d+e;
}
console.log(getNum(1,2,3,4,5)); // 15

// 不知道参数个数
function getNumArr(...num:number[]): number {
    let len = num.length, sum=0;
    for(let i = 0; i < len; i++) {
        sum += num[i];
    }
    return sum;
}
console.log(getNumArr(1,2,3,4,5)); // 15

// 两者混合用
// a: number, b: number 位置就是在参数的下标
function getNumArr1(a: number, b: number,...num:number[]): number {
    let len = num.length, sum=0;
    for(let i = 0; i < len; i++) {
        sum += num[i];
    }
    return sum + a + b;
}
console.log(getNumArr1(1,2,3,4,5)); // 15

四 函数重载

• Java 中方法重载，指的是两个或两个以上同名函数，但他们但参数不一样，这时会出现函数重载但情况。
• Typescript 中的重载，通过为同一个函数提供多个函数类型定义来试下多种功能的目的。

重载方式一 类型不同

function getPeopleInfo(name: string): string;
function getPeopleInfo(age: number): number;
function getPeopleInfo(sex: boolean): string;
function getPeopleInfo(arrNum: number[]): number[];
function getPeopleInfo(params: any): any {
    if (typeof params == 'number') {
        return `我的年龄是：${params}`;
    } else if (typeof params == 'string') {
        return `我叫：${params}`;
    } else if (typeof params == 'boolean') {
        return `我是个${params ? '女' : '男'}生`;
    } else {
        return `哈哈哈哈哈 `;
    }
}
getPeopleInfo(12); // number
getPeopleInfo('tom'); // string
getPeopleInfo(true); // boolean
getPeopleInfo([12,23,34]); // 对象
console.log(getPeopleInfo('tom')); // 我叫：tom
console.log(getPeopleInfo(12)); // 我的年龄是：12
console.log(getPeopleInfo(true)); // 我是个女生
console.log(getPeopleInfo([12,23,34])); // 哈哈哈哈哈 

重载方式二 参数个数和类型不同

function getPeopleInfo(name: string): string;
function getPeopleInfo(name: string, age? :number): string;
function getPeopleInfo(name: any, age?: any): any {
    if (age) {
        return `我叫：${name},我的年龄是：${age}`;
    } else {
        return `我叫：${name},我的年龄是：保密`;
    }
}

console.log(getPeopleInfo('tom')); // 我叫：tom,我的年龄是：保密
console.log(getPeopleInfo('tom', 21)); // 我叫：tom,我的年龄是：21

箭头函数

在箭头函数中，this 指向上下文。

setTimeout(function() {
    alert(0);
}, 1000);

setTimeout(() => {
    alert(11);
}, 1000);