TypeScript 函數(shù)

2019-06-21 15:06 更新

函數(shù)是可讀,可維護(hù)和可重用代碼的構(gòu)建塊。函數(shù)是一組用于執(zhí)行特定任務(wù)的語(yǔ)句。函數(shù)將程序組織成邏輯代碼塊。一旦定義,就可以調(diào)用函數(shù)來(lái)訪問(wèn)代碼。這使得代碼可以重用。此外,函數(shù)可以輕松讀取和維護(hù)程序的代碼。

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

序號(hào) 函數(shù)和說(shuō)明
1 定義一個(gè)函數(shù)

函數(shù)定義指定將執(zhí)行的任務(wù)和執(zhí)行方式。

2 調(diào)用一個(gè)函數(shù)

必須調(diào)用函數(shù)才能執(zhí)行它。

3 返回函數(shù)

函數(shù)也可以將值與控制一起返回給調(diào)用者。

4 參數(shù)化函數(shù)

參數(shù)是一種將值傳遞給函數(shù)的機(jī)制。

1、定義函數(shù)

函數(shù)定義指定將執(zhí)行的任務(wù)和執(zhí)行方式。使用函數(shù)之前,必須先定義它。使用function關(guān)鍵字定義函數(shù)。用于定義標(biāo)準(zhǔn)函數(shù)的語(yǔ)法如下:

語(yǔ)法

function  function_name() { 
   // function body 
}
示例:簡(jiǎn)單的函數(shù)定義
function () {   
   //function definition 
   console.log("function called") 
}

2、調(diào)用一個(gè)函數(shù)

必須調(diào)用函數(shù)才能執(zhí)行它。此過(guò)程稱為函數(shù)調(diào)用。

語(yǔ)法
Function_name()

下面的例子說(shuō)明一個(gè)函數(shù)如何被調(diào)用

示例

function test() {   // function definition    
   console.log("function called") 
} 
test()              // function invocation

在編譯時(shí),它會(huì)產(chǎn)生相同的JavaScript代碼:

function test() { 
   console.log("function called"); 
} 
test();    // function invocation

它會(huì)產(chǎn)生以下的輸出:

function called

3、返回函數(shù)

函數(shù)也可以將值與控件一起返回給調(diào)用者。這些函數(shù)稱為返回函數(shù)。

語(yǔ)法

function function_name():return_type { 
   //statements 
   return value; 
}
  • return_type可以是任何有效的數(shù)據(jù)類型。

  • 返回函數(shù)必須用一個(gè)return語(yǔ)句結(jié)束。

  • 函數(shù)最多可以返回一個(gè)值。換句話說(shuō),每個(gè)函數(shù)只能有一個(gè)return語(yǔ)句。

  • 返回值的數(shù)據(jù)類型必須與函數(shù)的返回類型匹配。

示例
//function defined 
function greet():string { //the function returns a string 
   return "Hello World" 
} 

function caller() { 
   var msg = greet() //function greet() invoked 
   console.log(msg) 
} 

//invoke function 
caller()
  • 本示例聲明了一個(gè)函數(shù)greet()。該函數(shù)的返回類型為string。

  • 行函數(shù)返回一個(gè)string值給調(diào)用者。這是通過(guò)return語(yǔ)句來(lái)實(shí)現(xiàn)的。

  • 函數(shù)greet()返回一個(gè)string,該string存儲(chǔ)在變量msg中。稍后顯示為輸出。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
//function defined
function greet() {
   return "Hello World";
}
function caller() {
   var msg = greet(); //function greet() invoked
   console.log(msg);
}
//invoke function
caller();

上面的代碼的輸出如下:

Hello World

4、參數(shù)化函數(shù)

參數(shù)是一種將值傳遞給函數(shù)的機(jī)制。參數(shù)構(gòu)成函數(shù)簽名的一部分。參數(shù)值在調(diào)用期間傳遞給函數(shù)。除非明確指定,否則傳遞給函數(shù)的值的數(shù)量必須與定義的參數(shù)的數(shù)量相匹配。

在調(diào)用函數(shù)時(shí),有兩種方法可以將參數(shù)傳遞給函數(shù):

序號(hào) 調(diào)用類型和說(shuō)明
1

按值調(diào)用

此方法將參數(shù)的實(shí)際值復(fù)制到函數(shù)的形式參數(shù)中。在這種情況下,對(duì)函數(shù)內(nèi)部參數(shù)所做的更改不會(huì)對(duì)參數(shù)產(chǎn)生影響。

2

通過(guò)指針調(diào)用

此方法將一個(gè)參數(shù)的地址復(fù)制到形式參數(shù)中。在函數(shù)內(nèi)部,該地址用于訪問(wèn)調(diào)用中使用的實(shí)際參數(shù)。這意味著對(duì)參數(shù)進(jìn)行了更改。

以下是函數(shù)使用參數(shù)的方式:

位置參數(shù)

function func_name( param1 [:datatype], ( param2 [:datatype]) {   
}
示例:位置參數(shù)
function test_param(n1:number,s1:string) { 
   console.log(n1) 
   console.log(s1) 
} 
test_param(123,"this is a string")
  • 該代碼片段聲明了一個(gè)帶有三個(gè)參數(shù)的函數(shù)test_param,即n1,s1和p1。

  • 不必指定參數(shù)的數(shù)據(jù)類型。在沒(méi)有數(shù)據(jù)類型的情況下,該參數(shù)被認(rèn)為是any類型。在上面的示例中,第三個(gè)參數(shù)將是any類型

  • 傳遞的值的數(shù)據(jù)類型必須與其聲明期間的參數(shù)類型匹配。如果數(shù)據(jù)類型不匹配,編譯器將拋出錯(cuò)誤。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
function test_param(n1, s1) {
   console.log(n1);
   console.log(s1);
}
test_param(123, "this is a string");

上面的代碼的輸出如下:

123 
this is a string

可選參數(shù)

當(dāng)函數(shù)的執(zhí)行不需要強(qiáng)制傳遞參數(shù)時(shí),可以使用可選參數(shù)。通過(guò)在其名稱后附加問(wèn)號(hào),可以將參數(shù)標(biāo)記為可選??蛇x參數(shù)應(yīng)設(shè)置為函數(shù)的最后一個(gè)參數(shù)。使用可選參數(shù)聲明函數(shù)的語(yǔ)法如下所示:

function function_name (param1[:type], param2[:type], param3[:type])
示例:可選參數(shù)
function disp_details(id:number,name:string,mail_id?:string) { 
   console.log("ID:", id); 
   console.log("Name",name); 
   
   if(mail_id!=undefined)  
   console.log("Email Id",mail_id); 
}
disp_details(123,"John");
disp_details(111,"mary","mary@xyz.com");
  • 上面的例子聲明了一個(gè)參數(shù)化函數(shù)。這里,第三個(gè)參數(shù),即mail_id是可選參數(shù)。

  • 如果在函數(shù)調(diào)用期間未向可選參數(shù)傳遞值,則將參數(shù)的值設(shè)置為undefined。

  • 僅當(dāng)參數(shù)傳遞值時(shí),該函數(shù)才會(huì)打印mail_id的值。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
function disp_details(id, name, mail_id) {
   console.log("ID:", id);
   console.log("Name", name);
	
   if (mail_id != undefined)
      console.log("Email Id", mail_id);
}
disp_details(123, "John");
disp_details(111, "mary", "mary@xyz.com");

上面的代碼將產(chǎn)生以下輸出:

ID:123 
Name John 
ID: 111 
Name  mary 
Email Id mary@xyz.com

rest參數(shù)

rest參數(shù)類似于Java的變量參數(shù)。rest參數(shù)不限制可以傳遞給函數(shù)的值的數(shù)目。但是,傳遞的值必須都是相同的類型。換句話說(shuō),rest參數(shù)充當(dāng)相同類型的多個(gè)參數(shù)的占位符。

要聲明一個(gè)rest參數(shù),參數(shù)名稱前綴為三個(gè)句點(diǎn)。任何nonrest參數(shù)都應(yīng)該在rest參數(shù)之前。

示例:rest參數(shù)
function addNumbers(...nums:number[]) {  
   var i;   
   var sum:number = 0; 
   
   for(i = 0;i<nums.length;i++;) { 
      sum = sum + nums[i]; 
   } 
   console.log("sum of the numbers",sum) 
} 
addNumbers(1,2,3) 
addNumbers(10,10,10,10,10)
  • 函數(shù)的addNumbers()聲明,接受一個(gè)rest參數(shù)nums。必須將rest參數(shù)的數(shù)據(jù)類型設(shè)置為數(shù)組。此外,一個(gè)函數(shù)最多只能有一個(gè)rest參數(shù)。

  • 通過(guò)分別傳遞三個(gè)和六個(gè)值來(lái)調(diào)用該函數(shù)兩次。

  • for循環(huán)遍歷參數(shù)列表,傳遞給函數(shù)并計(jì)算它們的總和。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

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

上面的代碼的輸出如下:

sum of numbers 6 
sum of numbers 50

默認(rèn)參數(shù)

默認(rèn)情況下,還可以為函數(shù)參數(shù)指定值。但是,這些參數(shù)也可以顯式傳遞值。

語(yǔ)法

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

注意:參數(shù)不能同時(shí)聲明為可選和默認(rèn)值。

示例:默認(rèn)參數(shù)

function calculate_discount(price:number,rate:number = 0.50) { 
   var discount = price * rate; 
   console.log("Discount Amount: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
function calculate_discount(price, rate) {
   if (rate === void 0) { rate = 0.50; }
   var discount = price * rate;
   console.log("Discount Amount: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);

它的輸出如下:

Discount amount : 500 
Discount amount : 300
  • 本示例聲明了函數(shù)calculate_discount。該函數(shù)有兩個(gè)參數(shù) - price和rate。

  • 參數(shù)rate的值默認(rèn)設(shè)置為0.50。

  • 該程序調(diào)用函數(shù),只傳遞參數(shù)price的值。這里, rate的值是0.50(默認(rèn))

  • 調(diào)用相同的函數(shù),但有兩個(gè)參數(shù)。將覆蓋rate的默認(rèn)值,并將其設(shè)置為顯式傳遞的值。

匿名函數(shù)

未綁定到標(biāo)識(shí)符(函數(shù)名)的函數(shù)稱為匿名函數(shù)。這些函數(shù)在運(yùn)行時(shí)動(dòng)態(tài)聲明。匿名函數(shù)可以接受輸入和返回輸出,就像標(biāo)準(zhǔn)函數(shù)一樣。匿名函數(shù)在初始創(chuàng)建后通常無(wú)法訪問(wèn)。

可以為變量分配匿名函數(shù)。 這種表達(dá)式稱為函數(shù)表達(dá)式。

語(yǔ)法

var res = function( [arguments] ) { ... }
示例:一個(gè)簡(jiǎn)單的匿名函數(shù)
var msg = function() { 
   return "hello world";  
} 
console.log(msg())

在編譯時(shí),它會(huì)在JavaScript中生成相同的代碼:

它會(huì)產(chǎn)生下面的輸出:

hello world
示例:帶參數(shù)的匿名函數(shù)
var res = function(a:number,b:number) { 
   return a*b;  
}; 
console.log(res(12,2)) 

匿名函數(shù)返回傳遞給它的值的乘積。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var res = function (a, b) {
   return a * b;
};
console.log(res(12, 2));

上面的代碼的輸出如下:

24

函數(shù)表達(dá)式和函數(shù)聲明是同義詞嗎?

函數(shù)表達(dá)式和函數(shù)聲明不是同義詞。與函數(shù)表達(dá)式不同,函數(shù)聲明由函數(shù)名綁定。

兩者的根本區(qū)別在于,函數(shù)聲明在執(zhí)行之前被解析。另一方面,僅在腳本引擎在執(zhí)行期間遇到函數(shù)表達(dá)式時(shí)才解析函數(shù)表達(dá)式。

當(dāng)JavaScript解析器在主代碼流中看到一個(gè)函數(shù)時(shí),它會(huì)假定函數(shù)聲明。當(dāng)函數(shù)作為語(yǔ)句的一部分出現(xiàn)時(shí),它是一個(gè)函數(shù)表達(dá)式。

Function構(gòu)造函數(shù)

TypeScript還支持使用名為Function()的內(nèi)置JavaScript構(gòu)造函數(shù)定義函數(shù)。

語(yǔ)法

var res = new Function( [arguments] ) { ... }.
示例
var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

新的Function()是對(duì)構(gòu)造函數(shù)的調(diào)用,而構(gòu)造函數(shù)又創(chuàng)建并返回函數(shù)引用。

在編譯時(shí),它會(huì)在JavaScript中生成相同的代碼。

上述例子代碼的輸出如下:

12 

遞歸和TypeScript函數(shù)

遞歸是一種通過(guò)對(duì)函數(shù)自身重復(fù)調(diào)用直到它到達(dá)結(jié)果來(lái)迭代操作的技術(shù)。當(dāng)您需要使用循環(huán)內(nèi)的不同參數(shù)重復(fù)調(diào)用相同的函數(shù)時(shí),最好應(yīng)用遞歸。

示例:遞歸

function factorial(number) {
   if (number <= 0) {         // termination case
      return 1; 
   } else {     
      return (number * factorial(number - 1));     // function invokes itself
   } 
}; 
console.log(factorial(6));      // outputs 720 

在編譯時(shí),它會(huì)在JavaScript中生成相同的代碼。

下面是它的輸出:

720
示例:匿名遞歸函數(shù)
(function () { 
   var x = "Hello!!";   
   console.log(x)     
})()      // the function invokes itself using a pair of parentheses ()

在編譯時(shí),它會(huì)在JavaScript中生成相同的代碼。

它的輸出如下:

Hello!!

Lambda函數(shù)

Lambda是指編程中的匿名函數(shù)。Lambda函數(shù)是表示匿名函數(shù)的一個(gè)簡(jiǎn)潔的機(jī)制。這些函數(shù)也被稱為Arrow函數(shù)

Lambda函數(shù) - 解析

Lambda函數(shù)有3個(gè)部分:

  • 參數(shù) - 一個(gè)函數(shù)可以選擇性的帶有參數(shù)

  • 箭頭符號(hào)/lambda符號(hào)(=>) - 它也被稱為作為轉(zhuǎn)到運(yùn)算符

  • 聲明 - 表示函數(shù)的指令集

提示 - 按照慣例,鼓勵(lì)使用單字母參數(shù)進(jìn)行緊湊而精確的函數(shù)聲明。

Lambda表達(dá)式

它是一個(gè)匿名函數(shù)表達(dá)式,指向一行代碼。它的語(yǔ)法如下:

( [param1, parma2,…param n] )=>statement;
示例:Lambda表達(dá)式
var foo = (x:number)=>10 + x 
console.log(foo(100))      //outputs 110 

該程序聲明了一個(gè)lambda表達(dá)式函數(shù)。該函數(shù)返回10的總和和傳遞的參數(shù)。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var foo = function (x) { return 10 + x; };
console.log(foo(100));      //outputs 110

這里是上面的代碼的輸出:

110

Lambda語(yǔ)句

Lambda語(yǔ)句是一個(gè)匿名函數(shù)聲明,指向一個(gè)代碼塊。當(dāng)函數(shù)體跨越多行時(shí)使用此語(yǔ)法。它的語(yǔ)法如下:

( [param1, parma2,…param n] )=> {
 
   //code block
}
示例:Lambda語(yǔ)句
var foo = (x:number)=> {    
   x = 10 + x 
   console.log(x)  
} 
foo(100)

返回函數(shù)的引用并將其存儲(chǔ)在變量foo中。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var foo = function (x) {
   x = 10 + x;
   console.log(x);
};
foo(100);

上述程序的輸出如下:

110

語(yǔ)法變化

參數(shù)類型推論

不必指定參數(shù)的數(shù)據(jù)類型。在這種情況下,參數(shù)的數(shù)據(jù)類型是any。讓我們來(lái)看看下面的代碼片段:

var func = (x)=> { 
   if(typeof x=="number") { 
      console.log(x+" is numeric") 
   } else if(typeof x=="string") { 
      console.log(x+" is a string") 
   }  
} 
func(12) 
func("Tom")

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var func = function (x) {
   if (typeof x == "number") {
      console.log(x + " is numeric");
   } else if (typeof x == "string") {
      console.log(x + " is a string");
   }
};
func(12);
func("Tom");

它的輸出如下:

12 is numeric 
Tom is a string

單個(gè)參數(shù)的可選圓括號(hào)

var display = x=> { 
   console.log("The function got "+x) 
} 
display(12)

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var display = function (x) {
   console.log("The function got " + x);
};
display(12);

它的輸出如下:

The function got 12

單個(gè)的語(yǔ)句的可選大括號(hào),無(wú)參數(shù)的空括號(hào)

下面的例子顯示了這兩個(gè)語(yǔ)法的變化。

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

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
var disp = function () {
   console.log("Function invoked");
};
disp();

它的輸出如下:

Function invoked

函數(shù)重載

函數(shù)能夠根據(jù)提供給它們的輸入進(jìn)行不同的操作。換句話說(shuō),程序可以有多個(gè)具有不同實(shí)現(xiàn)的同名方法。這種機(jī)制稱為函數(shù)重載。TypeScript提供對(duì)函數(shù)重載的支持。

要在TypeScript中重載函數(shù),您需要按照下面給出的步驟來(lái)操作:

第1步 - 聲明具有相同名稱但函數(shù)簽名不同的多個(gè)函數(shù)。函數(shù)簽名包括以下內(nèi)容:

  • 參數(shù)的數(shù)據(jù)類型

function disp(string):void; 
function disp(number):void;
  • 參數(shù)的數(shù)量

function disp(n1:number):void; 
function disp(x:number,y:number):void;
  • 參數(shù)的序列

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

注意 - 函數(shù)簽名不包括函數(shù)的返回類型。

第2步 - 該聲明必須后跟函數(shù)定義。如果參數(shù)類型在重載過(guò)程中不同,則參數(shù)類型應(yīng)設(shè)置為any 。此外, 如上所述的第二種情況,你可以考慮在函數(shù)定義期間將一個(gè)或多個(gè)參數(shù)標(biāo)記為可選。

第3步 - 最后,您必須調(diào)用該函數(shù)以使其正常運(yùn)行。

示例

現(xiàn)在讓我們來(lái)看看下面的示例代碼:

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");
  • 前兩行描述了函數(shù)重載聲明。該函數(shù)有兩個(gè)重載 -

    • 接受單個(gè)字符串參數(shù)的函數(shù)。

    • 接受兩個(gè)類型為number和string的值的函數(shù)。

  • 第三行定義了函數(shù)。參數(shù)的數(shù)據(jù)類型被設(shè)置為any。此外,第二個(gè)參數(shù)在這里是可選的。

  • 重載函數(shù)由最后兩個(gè)語(yǔ)句調(diào)用。

在編譯時(shí),它會(huì)生成以下JavaScript代碼:

//Generated by typescript 1.8.10
function disp(x, y) {
   console.log(x);
   console.log(y);
}
disp("abc");
disp(1, "xyz");

上面的代碼將產(chǎn)生以下輸出:

abc 
1 
xyz 
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)