Day9-TypeScript(TS)的介面型别(Interface)Part 2

今天要来讲介面型别的使用范例。

通常我们会使用介面来定义函式型别，程序码如下，

interface MathFunc {
    (x: number, y: number): number;
}

interface 为宣告介面型别。
MathFunc 为介面的名称，後面用大括弧来定义介面里面的属性名称与型别。
(x: number, y: number) 为传入的参数及其型别。
 number 接在冒号後的型别为传出得型别。

这就是介面型别的基本宣告，
特别需要注意的是，
介面型别不会转译成JS程序码喔。

接续使用上面的介面，使用范例如下，

let add: MathFunc;
add = function add(x: number, y: number) {
    return x + y;
}
console.log(add(10,20));

首先宣告add变数为MathFunc介面协别，
接着使用介面来定义函式型别，
传入参数为x: number及y: number，
分别x,y都是number型别，
而传出参数为x + y，
可知 number +  number = number ，
传出参数型别也是number型别，
符合介面别的传入传出型别，
接着呼叫此函式，
add(10,20)可得 10 + 20，
因此回传值为number型别的30。

另外，特别需要说明的是，
参数名称不必与介面名称相同，
也就是说介面传入参数使用x与y，
使用时也不一定要使用x与y，
更能在使用时依照程序所需，
使用更容易理解的参数名称即可，如下。

let add: MathFunc;
add = function add(i: number, j: number) {
    return i + j;
}
console.log(add(30,40));

可依不同需求调整参数名称。

今日结语

希望大家对於使用介面来定义函式型别有基本的了解了，
那麽下篇再循序渐进的让大家能更加了解不同的复杂型别，
因为JS没有这些型别，
所以基础大家就多试范例让自己熟悉一下，
大家加油喔!