DoubleRight The past of the world Blog's

TypeScript 函数 – 剩余，可选和默认参数

TypeScript 函数 – 剩余，可选和默认参数

原文： https://howtodoinjava.com/typescript/functions-rest-optional-default-params/

学习使用示例创建函数，函数类型声明，可选参数，默认参数和剩余参数。

Table of Contents

Create function
Function Types
Optional Parameters
Default Parameters
Rest Parameters

创建函数

在 TypeScript 中，可以通过两种方式创建函数。

  1. 函数声明

    这些是以传统 JavaScript 风格编写的命名函数。

    console.log( showMyName("Lokesh") ); // Hi! Lokesh

function showMyName (name: string): string { 
    return `Hi! ${name}`; 
}

  2. 函数表达式

    这些函数没有名称。 他们被分配给：

    console.log(showMyName("Lokesh"));	//Error - Define functional expression first.

let showMyName = function(name: string): string { 
    return `Hi! ${name}`; 
};

console.log(showMyName("Lokesh"));	//Hi! Lokesh

请注意，这两个函数声明看上去都相似，但两者却不相同。 JavaScript 解释器可以在解析函数声明时对其进行求值（变量提升）。 另一方面，函数表达式是赋值的一部分，直到赋值完成后才进行计算。

函数类型

在 TypeScript 中，一切都是类型，函数也是类型。 您可以将变量的类型声明为Function，如下所示。

let showMyName: Function = function(name: string): string { 
    return `Hi! ${name}`; 
};

在上面的示例中，showMyName是只能指向Function类型的变量。

如果您未指定变量类型，TypeScript 会自动推断类型。

可选参数

与 JavaScript 不同，如果我们尝试调用一个函数而不提供其签名声明的确切数量和参数类型，则 TypeScript 编译器将引发错误。

要解决此问题，可以使用带问号（?）的可选参数。 在下面的示例中，message被标记为可选参数。

let showMyName = function(name: string, message?: string): string { 
    return `Hi! ${name} {message}`; 
};

showMyName();							//Error
showMyName('Lokesh');					//Hi! Lokesh 
showMyName('Lokesh', 'How are you?');	//Hi! Lokesh How are you?

重要的是要注意，可选参数必须始终位于函数的参数列表中的必需参数之后。

默认参数

可选参数是一个很棒的功能，但让我们有逻辑去实现其值可以为undefined的方案。 它需要很多null检查和if-else块。

更好的方法是使这些参数具有默认值，而不是将它们声明为可选值。 如果这样做将导致更简洁的代码和易于维护的代码。

let showMyName = function(name: string, message: string = 'How are you?'): string { 
    return `Hi! ${name} {message}`; 
};

showMyName('Lokesh');						//Hi! Lokesh How are you?
showMyName('Lokesh', 'How are you buddy?');	//Hi! Lokesh How are you buddy?

1）请注意，与可选参数一样，默认参数也必须位于函数参数列表中的必需参数之后。

2）您不能使任何参数可选并且默认。 只允许一种类型。

剩余参数

有时，您可能希望创建可以具有不确定数量参数的函数。 对于一个或两个参数，可以使用可选参数或默认参数。 但是，如果参数数量未知，或者在运行时可能有所不同，该怎么办。

例如您正在读取输入字段值，并且该值可能会因动态 UI 而有所不同。 此处剩余参数将为您提供帮助。 剩余参数语法使我们可以将不确定数量的参数表示为数组。

  1. 要创建剩余参数，请在变量名称前使用省略号，即三个点（'...'）。
  2. 剩余参数必须为数组类型，否则我们将收到编译错误。
  3. 从理论上讲，对最大参数个数没有具体限制。
let addInputValues = function( ...values: number[] ): number { 
    let result = 0; 
    for (let val of values) { 
        result += val; 
    } 
    return result; 
};

addInputValues();					//OK - You can choose not to pass anything as well
addInputValues(1, 1);				//OK
addInputValues(1, 2, 3);			//OK
addInputValues(1, 2, 3, 4, 5, 6);	//OK

将我的问题放在评论部分。

学习愉快！

搜索