TypeScript中有關函數的知識

函數的類型

  • 聲明方式跟原生js相比有所改變
// 關鍵字聲明
function add(a:number,b:number):number{ //需要聲明參數類型,及返回值類型。
    return a+b;
}

// 表達式聲明

let addnumber = function(a:number,b:number):void{  //聲明參數爲number,返回值爲空的函數
    console.log(a,b);
}


addnumber(10,12);  //使用
add(10,33);       //使用


//聲明帶有可選參數的函數,可選參數必須位於確定參數之後

let addn = function(a:number,b:number,c?:number):void{
    console.log(a,b,c);
}

addn(10,11);
addn(10,11,12);

應該注意,函數的參數個數,參數類型,返回值類型,要保持和聲明時一樣。否則報錯。

  • 箭頭指定函數變量的類型
let sub:(a:number,b:number)=>number=function(x:number,y:number):number{
    return x+y;
}


let sub1:(a:number,b:number)=>number=function(x:number,y:number):void{  //報錯,不能將類型“(x: number, y: number) => void”分配給類型“(a: number, b: number) => number”。不能將類型“void”分配給類型“number”。
    return x+y;
}

我的理解:箭頭後面這個number代表函數返回值的類型,與後面匿名函數的返回值類型應該保持一致。

  • 用接口表示函數的形狀
interface fn{
    (x:number,y:number):number  //分別代表輸入類型,和返回值類型
}

let addtwo:fn;

addtwo = function(a,b):string{   //報錯
    return "1";
}

addtwo = function(a,b):number{   //正確
    return 1;
}

  • 參數默認值
let addnumber = function(a:number,b:number=1):void{  //聲明參數爲number,返回值爲空的函數
    console.log(a,b);
}

可以給參數指定默認值

  • 關於剩餘參數,給剩餘參數指定類型

剩餘參數實際上是數組。

function fun(array:any[],...rest:any[]):void{
    console.log(...rest);
}

fun([1,3],1,3,4,5,6,6);  //134566

我認爲這種方式可以在ts中聲明不定長參數函數。

  • 函數的重載

定義:函數的重載是對函數傳不同參數而進行不同處理的方式。

function thisAdd(x:number|string):number|string{   //利用或|運算符實現重載
    if(typeof x==="number"){
        return x.toString()+"heihei";
    }else{
        return parseInt(x);
    }
}
console.log(thisAdd(2));
console.log(thisAdd("3"));


function subl(x:number):string;   //另一種實現重載的語法
function subl(x:string):number;
function subl(x:boolean):boolean;
function subl(x:boolean|number|string):boolean|number|string{
    return x;
}


console.log(typeof subl(1));  //number
console.log(typeof subl("1"));  //string
console.log(typeof subl(true)); //boolean

注意,TS 會從最前面的函數定義開始匹配,所以多個函數定義如果有包含關係,需要優先把精確的定義寫在前面.嗯加油

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章