鴻蒙開發TypeScript語言：【函數】

来源:https://www.cnblogs.com/mau123789/p/18143559
-Advertisement-
Play Games

函數是一組一起執行一個任務的語句。 您可以把代碼劃分到不同的函數中。如何劃分代碼到不同的函數中是由您來決定的，但在邏輯上，劃分通常是根據每個函數執行一個特定的任務來進行的。 函數聲明告訴編譯器函數的名稱、返回類型和參數。函數定義提供了函數的實際主體。 函數定義 函數就是包裹在花括弧中的代碼塊，前面使 ...


函數是一組一起執行一個任務的語句。

您可以把代碼劃分到不同的函數中。如何劃分代碼到不同的函數中是由您來決定的，但在邏輯上，劃分通常是根據每個函數執行一個特定的任務來進行的。

函數聲明告訴編譯器函數的名稱、返回類型和參數。函數定義提供了函數的實際主體。

函數定義

函數就是包裹在花括弧中的代碼塊，前面使用了關鍵詞 function：

語法格式如下所示：

function function_name()
{
    // 執行代碼
}

實例

TypeScript

function () {   
    // 函數定義
    console.log("調用函數") 
}

調用函數

函數只有通過調用才可以執行函數內的代碼。

語法格式如下所示：

function_name()

實例

TypeScript

function test() {   // 函數定義
    console.log("調用函數") 
} 
test()              // 調用函數

函數返回值

有時，我們會希望函數將執行的結果返回到調用它的地方。

通過使用 return 語句就可以實現。

在使用 return 語句時，函數會停止執行，並返回指定的值。

語法格式如下所示：

function function_name():return_type { 
    // 語句
    return value; 
}
  • return_type 是返回值的類型。
  • return 關鍵詞後跟著要返回的結果。
  • 一般情況下，一個函數只有一個 return 語句。
  • 返回值的類型需要與函數定義的返回類型(return_type)一致。

實例

TypeScript

// 函數定義
function greet():string { // 返回一個字元串
    return "Hello World" 
} 
 
function caller() { 
    var msg = greet() // 調用 greet() 函數 
    console.log(msg) 
} 
 
// 調用函數
caller()
  • 實例中定義了函數 greet() ，返回值的類型為 string。
  • greet()  函數通過 return 語句返回給調用它的地方，即變數 msg，之後輸出該返回值。。

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

// 函數定義
function greet() {
    return "Hello World";
}
function caller() {
    var msg = greet(); // 調用 greet() 函數 
    console.log(msg);
}
// 調用函數
caller();

帶參數函數

在調用函數時，您可以向其傳遞值，這些值被稱為參數。

這些參數可以在函數中使用。

您可以向函數發送多個參數，每個參數使用逗號 , 分隔：

語法格式如下所示：

function func_name( param1 [:datatype], param2 [:datatype]) {   
}
  • param1、param2 為參數名。
  • datatype 為參數類型。

實例

TypeScript

function add(x: number, y: number): number {
    return x + y;
}
console.log(add(1,2))
  • 實例中定義了函數 add() ，返回值的類型為 number。
  • add()  函數中定義了兩個 number 類型的參數，函數內將兩個參數相加並返回。

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

function add(x, y) {
    return x + y;
}
console.log(add(1, 2));

輸出結果為：

3

可選參數和預設參數

可選參數

在 TypeScript 函數里，如果我們定義了參數，則我們必須傳入這些參數，除非將這些參數設置為可選，可選參數使用問號標識 ？。

實例

TypeScript

function buildName(firstName: string, lastName: string) {
    return firstName + " " + lastName;
}
 
let result1 = buildName("Bob");                  // 錯誤，缺少參數
let result2 = buildName("Bob", "Adams", "Sr.");  // 錯誤，參數太多了
let result3 = buildName("Bob", "Adams");         // 正確

以下實例，我們將 lastName 設置為可選參數：

TypeScript

function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}
 
let result1 = buildName("Bob");  // 正確
let result2 = buildName("Bob", "Adams", "Sr.");  // 錯誤，參數太多了
let result3 = buildName("Bob", "Adams");  // 正確

可選參數必須跟在必需參數後面。 如果上例我們想讓 firstName 是可選的，lastName 必選，那麼就要調整它們的位置，把 firstName 放在後面。

如果都是可選參數就沒關係。

預設參數

我們也可以設置參數的預設值，這樣在調用函數的時候，如果不傳入該參數的值，則使用預設參數，語法格式為：

function function_name(param1[:type],param2[:type] = default_value) { 
}

註意：參數不能同時設置為可選和預設。

實例

以下實例函數的參數 rate 設置了預設值為 0.50，調用該函數時如果未傳入參數則使用該預設值：

TypeScript

function calculate_discount(price:number,rate:number = 0.50) { 
    var discount = price * rate; 
    console.log("計算結果: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

function calculate_discount(price, rate) {
    if (rate === void 0) { rate = 0.50; }
    var discount = price * rate;
    console.log("計算結果: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);

輸出結果為：

計算結果:  500
計算結果:  300

剩餘參數

有一種情況，我們不知道要向函數傳入多少個參數，這時候我們就可以使用剩餘參數來定義。

剩餘參數語法允許我們將一個不確定數量的參數作為一個數組傳入。

TypeScript

function buildName(firstName: string, ...restOfName: string[]) {
    return firstName + " " + restOfName.join(" ");
}
  
let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

函數的最後一個命名參數 restOfName 以 ... 為首碼，它將成為一個由剩餘參數組成的數組，索引值從0（包括）到 restOfName.length（不包括）。

TypeScript

function addNumbers(...nums:number[]) {  
    var i;   
    var sum:number = 0; 
    
    for(i = 0;i<nums.length;i++) { 
       sum = sum + nums[i]; 
    } 
    console.log("和為：",sum) 
 } 
 addNumbers(1,2,3) 
 addNumbers(10,10,10,10,10)

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

function addNumbers() {
    var nums = [];
    for (var _i = 0; _i < arguments.length; _i++) {
        nums[_i] = arguments[_i];
    }
    var i;
    var sum = 0;
    for (i = 0; i < nums.length; i++) {
        sum = sum + nums[i];
    }
    console.log("和為：", sum);
}
addNumbers(1, 2, 3);
addNumbers(10, 10, 10, 10, 10);

輸出結果為：

和為： 6
和為： 50

匿名函數

匿名函數是一個沒有函數名的函數。

匿名函數在程式運行時動態聲明，除了沒有函數名外，其他的與標準函數一樣。

我們可以將匿名函數賦值給一個變數，這種表達式就成為函數表達式。

語法格式如下：

var res = function( [arguments] ) { ... }

實例

不帶參數匿名函數：

TypeScript

var msg = function() { 
    return "hello world";  
} 
console.log(msg())

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var msg = function () {
    return "hello world";
};
console.log(msg());

輸出結果為：

hello world

帶參數匿名函數：

TypeScript

var res = function(a:number,b:number) { 
    return a*b;  
}; 
console.log(res(12,2))

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var res = function (a, b) {
    return a * b;
};
console.log(res(12, 2));

輸出結果為：

24

匿名函數自調用

匿名函數自調用在函數後使用 () 即可：

TypeScript

(function () { 
    var x = "Hello!!";   
    console.log(x)     
 })()

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

(function () { 
    var x = "Hello!!";   
    console.log(x)    
})()

輸出結果為：

Hello!!

構造函數

TypeScript 也支持使用 JavaScript 內置的構造函數 Function() 來定義函數：

語法格式如下：

var res = new Function ([arg1[, arg2[, ...argN]],] functionBody)

參數說明：

  • arg1, arg2, ... argN：參數列表。
  • functionBody：一個含有包括函數定義的 JavaScript 語句的字元串。

實例

TypeScript

var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

輸出結果為：

12

遞歸函數

遞歸函數即在函數內調用函數本身。

舉個例子：
從前有座山，山裡有座廟，廟裡有個老和尚，正在給小和尚講故事呢！故事是什麼呢？"從前有座山，山裡有座廟，廟裡有個老和尚，正在給小和尚講故事呢！故事是什麼呢？'從前有座山，山裡有座廟，廟裡有個老和尚，正在給小和尚講故事呢！故事是什麼呢？……'"

實例

TypeScript

function factorial(number) {
    if (number <= 0) {         // 停止執行
        return 1; 
    } else {     
        return (number * factorial(number - 1));     // 調用自身
    } 
}; 
console.log(factorial(6));      // 輸出 720

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

function factorial(number) {
    if (number <= 0) { // 停止執行
        return 1;
    }
    else {
        return (number * factorial(number - 1)); // 調用自身
    }
}
;
console.log(factorial(6)); // 輸出 720

輸出結果為：

720

Lambda 函數

Lambda 函數也稱之為箭頭函數。

箭頭函數表達式的語法比函數表達式更短。

函數只有一行語句：

( [param1, param2,…param n] )=>statement;

實例

以下實例聲明瞭 lambda 表達式函數，函數返回兩個數的和：

TypeScript

var foo = (x:number)=>10 + x 
console.log(foo(100))      //輸出結果為 110

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var foo = function (x) { return 10 + x; };
console.log(foo(100)); //輸出結果為 110

輸出結果為：

110

函數是一個語句塊：

( [param1, param2,…param n] )=> {
 
    // 代碼塊
}

實例

以下實例聲明瞭 lambda 表達式函數，函數返回兩個數的和：

TypeScript

var foo = (x:number)=> {    
    x = 10 + x 
    console.log(x)  
} 
foo(100)

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var foo = function (x) {
    x = 10 + x;
    console.log(x);
};
foo(100);

輸出結果為：

110

我們可以不指定函數的參數類型，通過函數內來推斷參數類型:

TypeScript

var func = (x)=> { 
    if(typeof x=="number") { 
        console.log(x+" 是一個數字") 
    } else if(typeof x=="string") { 
        console.log(x+" 是一個字元串") 
    }  
} 
func(12) 
func("Tom")

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var func = function (x) {
    if (typeof x == "number") {
        console.log(x + " 是一個數字");
    }
    else if (typeof x == "string") {
        console.log(x + " 是一個字元串");
    }
};
func(12);
func("Tom");

輸出結果為：

12 是一個數字
Tom 是一個字元串

單個參數 () 是可選的：

TypeScript

var display = x => { 
    console.log("輸出為 "+x) 
} 
display(12)

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var display = function (x) {
    console.log("輸出為 " + x);
};
display(12);

輸出結果為：

輸出為 12

無參數時可以設置空括弧：

TypeScript

var disp =()=> { 
    console.log("Function invoked"); 
} 
disp();

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

var disp = function () {
    console.log("調用函數");
};
disp();

輸出結果為：

調用函數

函數重載

重載是方法名字相同，而參數不同，返回類型可以相同也可以不同。

每個重載的方法（或者構造函數）都必須有一個獨一無二的參數類型列表。

參數類型不同：

function disp(string):void; 
function disp(number):void;

參數數量不同：

function disp(n1:number):void; 
function disp(x:number,y:number):void;

參數類型順序不同：

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

如果參數類型不同，則參數類型應設置為 any。

參數數量不同你可以將不同的參數設置為可選。

實例

以下實例定義了參數類型與參數數量不同：

TypeScript

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 
 
function disp(x:any,y?:any):void { 
    console.log(x); 
    console.log(y); 
} 
disp("abc") 
disp(1,"xyz");

編譯以上代碼，得到以下 JavaScript 代碼：

JavaScript

function disp(x, y) {
    console.log(x);
    console.log(y);
}
disp("abc");
disp(1, "xyz");

輸出結果為：

abc
undefined
1
xyz

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • HarmonyOS NEXT應用開發之下拉刷新與上滑載入案例
    介紹 本示例介紹使用第三方庫的PullToRefresh組件實現列表的下拉刷新數據和上滑載入後續數據。 效果圖預覽 使用說明 進入頁面，下拉列表觸發刷新數據事件，等待數據刷新完成。 上滑列表到底部，觸發載入更多數據事件，等待數據載入完成。 實現思路 使用第三方庫pullToRefresh組件，將列表 ...
  • HarmonyOS NEXT應用開發之深色跑馬燈案例
    介紹 本示例介紹了文本寬度過寬時，如何實現文本首尾相接迴圈滾動並顯示在可視區，以及每迴圈滾動一次之後會停滯一段時間後再滾動。 效果圖預覽 使用說明： 1.進入頁面，檢票口文本處，實現文本首尾相接迴圈滾動，且在同一可視區，滾動完成之後，停滯一段時間後繼續滾動。 實現思路 由於ArkUI中的Marque ...
  • HarmonyOS NEXT應用開發之深色模式適配
    介紹 本示例介紹在開發應用以適應深色模式時，對於深色和淺色模式的適配方案，採取了多種策略如下： 固定屬性適配：對於部分組件的顏色屬性，如背景色或字體顏色，若保持不變，可直接設定固定色值或引用固定的資源文件。 雙資源目錄適配：在resources目錄下新增dark子目錄，用於存放深色模式下的特定顏色配 ...
  • HarmonyOS NEXT應用開發之異常處理案例
    介紹 本示例介紹了通過應用事件打點hiAppEvent獲取上一次應用異常信息的方法，主要分為應用崩潰、應用卡死以及系統查殺三種。 效果圖預覽 使用說明： 點擊構建應用崩潰事件，3s之後應用退出，然後打開應用進入應用異常頁面，隔1min左右後，顯示上次異常退出信息。 點擊構建應用卡死事件，需手動退出， ...
  • 鴻蒙開發TypeScript語言：【Number】
    TypeScript 與 JavaScript 類似，支持 Number 對象。 Number 對象是原始數值的包裝對象。 語法 var num = new Number(value); 註意： 如果一個參數值不能轉換為一個數字將返回 NaN (非數字值)。 Number 對象屬性 下表列出了 Nu ...
  • 鴻蒙HarmonyOS實戰-ArkUI動畫（佈局更新動畫）
    前言 動畫是一種通過連續展示一系列靜止的圖像（稱為幀）來創造出運動效果的藝術形式。它可以以手繪、電腦生成或其他各種形式呈現。在動畫中，每一幀都具有微小的變化，當這些幀被快速播放時，人眼會產生視覺上的錯覺，認為物體在運動。動畫可以用來表達故事、觀念、想法、情感或其他形式的藝術創作。它在電影、電視 ...
  • HarmonyOS NEXT應用開發之使用AKI輕鬆實現跨語言調用
    介紹 針對JS與C/C++跨語言訪問場景，NAPI使用比較繁瑣。而AKI提供了極簡語法糖使用方式，一行代碼完成JS與C/C++的無障礙跨語言互調，使用方便。本示例將介紹使用AKI編寫C++跨線程調用JS函數場景。通過調用C++全局函數，創建子線程來調用JS函數，實現對變數value的加10操作，為開 ...
  • 鴻蒙HarmonyOS實戰-ArkUI組件（Canvas）
    一、Canvas Canvas組件是一種圖形渲染組件，它提供了一個畫布（canvas），開發者可以在上面繪製各種圖形、文本等。Canvas組件通常用於創建游戲、數據可視化等需要動態繪製圖形的應用程式。 Canvas組件提供了多個API，開發者可以使用這些API進行繪製操作。常用的API包括繪製矩 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類