TypeScript - 匿名函數：初學者指南

你好，未來的編程超級巨星！今天，我們將要進入 TypeScript 的精彩世界，並探索一個初看起來可能會有點神秘的概念：匿名函數。別擔心，如果這聽起來像是秘密情報員的代號——到了這個教學的結尾，你將會像專家一樣使用這些函數！

匿名函數是什麼？

在我們深入之前，讓我們先解釋一下我們所謂的“匿名函數”。在編程領域，我們通常會給我們的函數命名，例如 "calculateTotal" 或 "sendEmail"。但有時候，我們會創建一些不需要名字的函數——它們就像是編程宇宙中的蒙面英雄。這些無名奇觀就是我們所稱的匿名函數。

想像你在一次化裝舞會上。每個人都在戴著精美的面具，你看不見他們的臉，也不知道他們的名字。但他們仍然可以跳舞、說話和享受樂趣。匿名函數在我們的代碼中的所作所为與此類似——它們在不需要正式介紹的情況下執行任務！

現在，讓我們看看我們如何在 TypeScript 中以不同的方式創建這些匿名函數。

使用 'function' 鍵定義匿名函數

創建匿名函數的第一種方法是使用老好人 'function' 鍵。這是它的樣子：

let greet = function(name: string) {
console.log("Hello, " + name + "!");
};

greet("Alice"); // 輸出：Hello, Alice!

在這個例子中，我們創建了一個對某人說你好的一個函數。讓我們分解一下：

1. 我們從 let greet = 開始。這是我們創建一個名為 'greet' 的變量。
2. 等於號之後，我們有 function(name: string) { ... }。這是我們的匿名函數。
3. 在大括號 { } 內，我們有函數體——函數實際上要做的事情。
4. 然後我們可以通過調用 greet("Alice") 來使用這個函數。

這就像我們創造了一個友好的機器人，它可以向任何人問好，而我們給這個機器人起了個代號 'greet'！

使用箭頭函數語法定義匿名函數

現在，讓我們看看一種更現代且簡潔的寫作匿名函數的方法——箭頭函數語法。這就像函數世界的跑車：時尚、快速且外觀酷炫！

let add = (a: number, b: number): number => {
return a + b;
};

console.log(add(5, 3)); // 輸出：8

這裡發生了什麼：

1. 我們創建了一個名為 'add' 的變量。
2. (a: number, b: number) 部分定義了我們函數所需的參數。
3. 括號後的 : number 指定我們的函數將返回一個數字。
4. => 是我們將其作為箭頭函數的標誌（它看起來有點像箭頭，對吧？）。
5. 在 { } 內，我們有我們的函數體。

對於簡單的函數，我們甚至可以這樣簡化：

let multiply = (a: number, b: number): number => a * b;

console.log(multiply(4, 6)); // 輸出：24

在這種情況下，我們移除了 { } 和 return 鍵。這就像我們的函數在說，“我這麼簡單，我不需要所有那些額外的符號！”

使用匿名函數作為回調函數

現在，讓我們看看匿名函數真正閃光的地方——作為回調函數。回調函數是我們傳遞給另一個函數作為參數的函數。這就像告訴一個朋友，“嘿，你完成任務後，為我做這件事。”

讓我們看一個使用 setTimeout 函數的例子：

setTimeout(() => {
console.log("這條訊息將在2秒後出現！");
}, 2000);

在這段代碼中：

1. setTimeout 是一個函數，它在指定時間後執行某事。
2. 第一個參數是我們的匿名函數，寫作箭頭函數的形式。
3. 第二個參數（2000）是我們要等待的毫秒數（2秒）。

這就像設定一個計時器並告訴它，“當你響鈴時，顯示這條訊息！”

這裡有另一個使用數組方法的例子：

let numbers = [1, 2, 3, 4, 5];

let doubledNumbers = numbers.map((num) => num * 2);

console.log(doubledNumbers); // 輸出：[2, 4, 6, 8, 10]

在這種情況下：

1. 我們有一個數字數組。
2. 我們使用 map 函數，它將函數應用於數組的每個元素。
3. 我們的匿名函數 (num) => num * 2 將每個數字加倍。
4. 結果是一個所有數字都已加倍的新數組。

這就像我們創造了一台機器，它將每個數字加倍，並把它們放入一個新盒子！

結論

好了，各位！我們已經揭開了 TypeScript 中匿名函數的神秘面紗。記住，這些函數就像你代碼中的小精靈——它們在不需

Credits: Image by storyset