iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 6
0

函式 (function) 在 JavaScript 中是一等公民,相同的,它在 TypeScript 裡面也是一樣。也就是說,你可以把 function 當成物件一樣的使用,可以 assign function 給一個變數,也可以回傳一個 function, 甚至你也可以把 function 當成變數傳給另一個 function。

在 TypeScript 中,一個 function 大致上會長的像下面這樣:

function add(a: number, b: number): number {
    return a + b;
}

一般來說,function 的回傳型別(以上面的例子來說是 number)是可以不用寫的,TypeScript 大部分都可以幫你從實做的 function 內容推導出來。但是我還是建議要寫會比較好,一來是可讀幸會比較高,二來,萬一我們在實做的時候如果不小心出錯,也會很快的被檢查出來。JavaScript

那 function 除了上述的基本樣子之外,還可以是

將 function assign 給一個變數

let functionVariable = function(a: number): number {
    return a * 2;
}

用比較簡潔的方式宣告並 assign 給一個變數

let functionVariable2 = (a: number) => {
    return a * 2;
}

如果 function 只有單行,你甚至可以這樣寫

let functionVariable3 = (a: number) => a * 2

參數 (parameter)

有了函式之後,我們就會需要參數來傳給我們要呼叫的函式, 最簡單的範例就是:

function greet(name: string): string {
    return 'Hello!! ' + name;
}
// 接著我們就可以這樣呼叫他,帶入一個參數 name

let result = greet('周星星'); // 這裡的 result 就會是 Hello!! 周星星

// 如果傳錯型別,就會發生錯誤了, 例如
let resutl2 = greet(9527); // 這行在編譯的時候就會失敗

在 TypeScript 中也有提供像 Python 或 Scala 一樣的功能,參數有預設值。也就是說,當你呼叫函式時,該參數如果每給,他就會使用預設值當參數的值。

function greet(name: string, greeting = 'Hello'): void {
    console.log(greeting + '!! ' + name + '.');
}

greet('SuperMan'); // 這個結果會是 Hello!! SuperMan.
greet('SuperMan', 'Hi'); // 這個結果會是 Hi!! SuperMan.

除了上面的寫法,還有另一種方式,那就是把他當成選擇性的,換句話說就是把預設值寫在函式的實做裡面:

function greet(greeting: string, name?: string): void {
  console.log(greeting + "!!! " + (name || "梅友仁"));
}

greet("Hey");
greet("Hello", "My dear");

上一篇
第05天-宣告變數
下一篇
第07天-介面
系列文
從零開始進入 JavaScript & TypeScript 的世界30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言