TypeScript三种函数参数解析 – TypeScript开发教程

上一章TypeScript教程请查看：TypeScript函数重载

函数是任何包含某些业务逻辑的应用程序的基本构件，在TypeScript中创建函数的过程类似于在JavaScript中创建函数的过程。

在函数中，参数是传递给函数的值或参数。编译器接受与函数签名中定义的相同数量和类型的参数。如果编译器与函数签名中的参数不匹配，则会给出编译错误。

我们可以将函数参数分为三类:

• 可选参数
• 默认参数
• rest参数

可选参数

JavaScript允许我们调用函数而不传递任何参数。因此，在JavaScript函数中，参数是可选的。如果我们声明函数而不传递参数，那么每个参数值都是未定义的。

与JavaScript不同，如果我们试图调用一个函数而不提供其函数签名中声明的参数的确切数量和类型，那么TypeScript编译器将抛出一个错误。为了克服这个问题，TypeScript引入了可选参数。我们可以通过使用问号符号(‘?’)来使用可选参数。这意味着可能接收值或不接收值的参数可以附加一个“?”符号，将它们标记为可选的。在下面的示例中，e_mail_id被标记为一个可选参数。

语法

function function_name(parameter1[:type], parameter2[:type], parameter3 ? [:type]) { }  

例子

function showDetails(id:number,name:string,e_mail_id?:string) {   
   console.log("ID:", id, " Name:",name);   
   if(e_mail_id!=undefined)    
   console.log("Email-Id:",e_mail_id);   
}  
showDetails(101,"La Oreja");  
showDetails(105,"Van","Van@srcmini02.com");  

默认参数

TypeScript提供了一个选项来设置函数参数的默认值。如果用户没有向参数传递值，则TypeScript初始化参数的默认值。默认参数的行为与可选参数相同。对于默认参数，如果在函数调用中没有传递值，则默认参数必须遵循函数签名中所需的参数。但是，如果函数签名在必需的参数之前有一个默认参数，我们仍然可以调用一个函数，该函数将默认参数作为未定义的值传递。

注意：我们不能同时将参数设置为默认和可选。

语法

function function_name(parameter1[:type], parameter2[:type] = default_value) { }  

例子

function displayName(name: string, greeting: string = "Hello") : string {  
    return greeting + ' ' + name + '!';  
}  
console.log(displayName('srcmini'));   // "Hello srcmini!"  
console.log(displayName('srcmini', 'Hi'));   // "Hi srcmini!".  
console.log(displayName('Van'));    // "Hello Van!"  

rest参数

它用于向函数传递零个或多个值。我们可以通过在参数前加上三个“点”字符(‘…’)来声明它。它允许函数在不使用arguments对象的情况下拥有不同数量的参数。TypeScript编译器将使用rest参数创建一个参数数组，这样所有的数组方法都可以使用rest参数。rest参数很有用，因为我们有不确定数量的参数。

rest参数要遵循的规则:

• 我们只能在一个函数中使用一个rest参数。
• 它必须是数组类型。
• 它必须是参数列表中的最后一个参数。

语法

function function_name(parameter1[:type], parameter2[:type], ...parameter[:type]) { }  

例子

function sum(a: number, ...b: number[]): number {  
  let result = a;  
  for (var i = 0; i < b.length; i++) {  
  result += b[i];  
  }  
  return result;  
}  
let result1 = sum(3, 5);  
let result2 = sum(3, 5, 7, 9);  
console.log(result1 +"\n" + result2);