Typescript入門-Day7:函數

更新於 發佈於 閱讀時間約 4 分鐘

函數的基本結構

在 TypeScript 中,函數是執行特定任務的一組語句。以下介紹幾種定義函數的方法。

函數聲明

函數聲明是一種定義函數的基本方式。

function greet(name: string): void {
console.log(`Hello, ${name}!`);
}

函數表達式

函數表達式是將函數賦值給變數的一種方式。

const greet = function(name: string): void {
console.log(`Hello, ${name}!`);
};

箭頭函數

箭頭函數提供了一種簡潔的函數定義方式,尤其適合於簡短的函數。

const greet = (name: string): void => {
console.log(`Hello, ${name}!`);
};

匿名函數

匿名函數是一種沒有名稱的函數,通常用於即時執行的情況。

setTimeout(function() {
console.log("This is an anonymous function.");
}, 1000);

函數的呼叫

函數呼叫是指執行定義好的函數,並根據需要傳遞參數。

function greet(name: string): void {
console.log(`Hello, ${name}!`);
}

greet("Alice"); // Hello, Alice!

函數的參數

函數的參數用於接收外部傳入的值。

單個參數

函數可以接收單個參數。

function square(num: number): number {
return num * num;
}

console.log(square(4)); // 16

多個參數

函數可以接收多個參數。

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

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

預設參數值

函數參數可以有預設值,當呼叫函數時未提供相應的參數值時,會使用預設值。

function greet(name: string = "Guest"): void {
console.log(`Hello, ${name}!`);
}

greet(); // Hello, Guest!

剩餘參數

剩餘參數用於接收不定數量的參數,並將其存放在一個數組中。

function sum(...numbers: number[]): number {
return numbers.reduce((total, num) => total + num, 0);
}

console.log(sum(1, 2, 3, 4)); // 10

函數的返回值

函數可以返回一個值,並且返回值的類型可以是多種多樣的。

單個返回值

函數可以返回單個值。

function getGreeting(name: string): string {
return `Hello, ${name}!`;
}

console.log(getGreeting("Alice")); // Hello, Alice!

返回物件

函數可以返回一個物件,這樣可以包含多個返回值。

function createUser(name: string, age: number): { name: string, age: number } {
return { name, age };
}

const user = createUser("Alice", 30);
console.log(user); // { name: 'Alice', age: 30 }

返回函數

函數可以返回另一個函數。

function makeMultiplier(multiplier: number): (num: number) => number {
return function(num: number): number {
return num * multiplier;
};
}

const double = makeMultiplier(2);
console.log(double(5)); // 10
avatar-img
15會員
111內容數
日後將分享關於我的經驗(日常、工作、技術),並期待未來能創造屬於我的宇宙。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
Michael楊 的其他內容
本章節提供了關於Typescript中流程控制元素的詳細介紹,包括if, else if, else語句,三元運算子,switch語句,各種for迴圈,while迴圈,循環嵌套和控制迴圈語句(break,continue和標籤)的使用。
此章節旨在介紹TypeScript中的運算符,包括算數運算子、比較運算子、賦值運算子、位元運算子,以及他們的優先等級。每種運算子都以清晰的解釋和代碼範例進行詳細說明,幫助讀者理解並有效地在自己的程式碼中使用。
本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
本章節提供了關於Typescript中流程控制元素的詳細介紹,包括if, else if, else語句,三元運算子,switch語句,各種for迴圈,while迴圈,循環嵌套和控制迴圈語句(break,continue和標籤)的使用。
此章節旨在介紹TypeScript中的運算符,包括算數運算子、比較運算子、賦值運算子、位元運算子,以及他們的優先等級。每種運算子都以清晰的解釋和代碼範例進行詳細說明,幫助讀者理解並有效地在自己的程式碼中使用。
本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
你可能也想看
Google News 追蹤
Thumbnail
2.0 上古漢語的特殊結構 2.3 之乎者也 —  也 (矣﹑焉) 2.3.1 也 一﹕初探之四 現在讓我們從函數引申出來的函子/論元觀點來解析上述「也」字的用法。用初級計算機科學編程的語言來說,函子就是一個具有函數功能的物件 (object),方便我們使用﹔它的功能就是讓我們可以召喚
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
主要來講宣告函式跟箭頭函式 : 宣告函式(Function Declaration) 語法: function functionName(parameters) { return result; } 特點: 使用 function 關鍵字 函式名稱是必需的 存在函式
Thumbnail
一般在使用 TypeScript 的時候,大家都有遇過定義列舉資料的情境吧。 不過不管是 enum 和 literal 的方式其實都有些小缺點,以下推薦一個個人認為體驗更好的方式。
※ TypeScript範例說明: interface ITest { test1: string test2: number print: (arg: string[]) => boolean } class Test implements ITest { public te
※ 函式進階介紹: 箭頭函式: 箭頭函式相比於一般函式,語法相當簡潔。除了少去 function 關鍵字,如果只有一個參數,箭頭函式可以省略括號;只有一行程式碼,就是直接簡單返回一個變數或簡單的表達式,可以省略大括號和 return。例子如下: //一般函式計算平方用的寫法 const squ
※ 函式基礎介紹: ※ JavaScript 特殊的函式特性: 函式可以當成值來傳遞 (可以放進變數或放進物件) 函式可以當成函式的參數 callback - 在特定事件中觸發函式 (非同步特性) ※ 函式的基本寫法: ※ 調用 (invoke) 函式: "調用" 意指呼叫或執行
Thumbnail
針對 JavaScript 中的原始型別和隱性轉型進行了詳細的探討
Thumbnail
上一篇文章分享了 TypeScript 的定義、前端角色定位,如果你不是很確定「TypeScript 是什麼?」、「TypeScript 作為 JavaScript 的超集,在網頁開發扮演怎麼樣的角色?」這兩個問題的答案,建議可以回到上一篇先了解一下。
Thumbnail
本文將介紹自定函式及應用,利用程式範例解釋為什麼要用到自定函式 自定函式好處當然就是,讓你的程式碼看起來比較簡潔,在重複使用到的程式碼區塊,可以包裝成函式,讓你重複使用它。
Thumbnail
2.0 上古漢語的特殊結構 2.3 之乎者也 —  也 (矣﹑焉) 2.3.1 也 一﹕初探之四 現在讓我們從函數引申出來的函子/論元觀點來解析上述「也」字的用法。用初級計算機科學編程的語言來說,函子就是一個具有函數功能的物件 (object),方便我們使用﹔它的功能就是讓我們可以召喚
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
主要來講宣告函式跟箭頭函式 : 宣告函式(Function Declaration) 語法: function functionName(parameters) { return result; } 特點: 使用 function 關鍵字 函式名稱是必需的 存在函式
Thumbnail
一般在使用 TypeScript 的時候,大家都有遇過定義列舉資料的情境吧。 不過不管是 enum 和 literal 的方式其實都有些小缺點,以下推薦一個個人認為體驗更好的方式。
※ TypeScript範例說明: interface ITest { test1: string test2: number print: (arg: string[]) => boolean } class Test implements ITest { public te
※ 函式進階介紹: 箭頭函式: 箭頭函式相比於一般函式,語法相當簡潔。除了少去 function 關鍵字,如果只有一個參數,箭頭函式可以省略括號;只有一行程式碼,就是直接簡單返回一個變數或簡單的表達式,可以省略大括號和 return。例子如下: //一般函式計算平方用的寫法 const squ
※ 函式基礎介紹: ※ JavaScript 特殊的函式特性: 函式可以當成值來傳遞 (可以放進變數或放進物件) 函式可以當成函式的參數 callback - 在特定事件中觸發函式 (非同步特性) ※ 函式的基本寫法: ※ 調用 (invoke) 函式: "調用" 意指呼叫或執行
Thumbnail
針對 JavaScript 中的原始型別和隱性轉型進行了詳細的探討
Thumbnail
上一篇文章分享了 TypeScript 的定義、前端角色定位,如果你不是很確定「TypeScript 是什麼?」、「TypeScript 作為 JavaScript 的超集,在網頁開發扮演怎麼樣的角色?」這兩個問題的答案,建議可以回到上一篇先了解一下。
Thumbnail
本文將介紹自定函式及應用,利用程式範例解釋為什麼要用到自定函式 自定函式好處當然就是,讓你的程式碼看起來比較簡潔,在重複使用到的程式碼區塊,可以包裝成函式,讓你重複使用它。