TypeScript学习笔记二、函数类型

70 阅读1分钟

函数声明 定义类型和返回值

function calcFn(numA:number, numB:number):number{
    return numA + numB;
}
const calcFn = (numA:number, numB:number):number=>{
    return numA + numb;
}

calcFn(44, 44); // 88

函数默认参数与可选参数

可选参数与默认参数不能同时定义选择。

function calcFn(numA:number = 8, numB?:number)=>{
    return numA + numB;
}

calcFn(); // NaN
calcFn(6, 2); // 8

对象参数函数,接口定义函数

interface IFriend{
    name: string;
    gender: number;
}

function createFriend(friend:IFriend){
    return friend;
}

createFriend({name: "LiLei", gender: 1});

函数this类型

ts可以定义this的类型,在js中无法使用 必须是第一个参数定义this的类型

interface IObj{
    user: number[];
    add: (this:IObj, num:number)=> void;
}
let obj:IObj = {
    user: [2,4,6],
    add(this:IObj, num:number){
        this.user.push(num);
    }
}

obj.add(8);

定义剩余参数

const fn = (array:number[], ...item:any[]):any[] => {
    console.log(array, items);
    return items
}
let arg1:number[] = [2,4,6];
fn(arg1, "8", "9", "7");

函数重载

重载是方法名字相同,而参数不同,返回类型可以相同也可以不同。 如果参数类型不同,则参数类型应设置为any 参数数量不同你可以将不同的参数设置为可选

let nums:number[] = [1,2,3];

function findNum(add:number[]):number[]; // 添加数字
function findNum(id:number):number[]; // 传入了id就查询单个
function findNum():number[]; // 没有参数查找全部
function findNum(ids?:number | number[]):number[]{
    if(typeof ids == "number"){
        return nums.filter(x => x == ids);
    }else if(Array.isArray(ids)){
        nums.push(...ids);
        return nums;
    }else{
        return nums;
    }
}