TypeScript 创建匿名函数
在TypeScript中,我们可以使用函数关键字来声明函数。它是一个执行某些操作的代码块,我们可以通过调用函数来重复使用函数代码。
有两种类型的函数。一个是命名函数,另一个是匿名函数。命名函数意味着我们可以用唯一的标识符来识别它,而标识符对于匿名函数来说并不存在。
我们将在本教程中深入讨论匿名函数。正如 “匿名函数 “这个词所说,它意味着一个没有任何名称或标识符的函数定义。我们可以简单地将匿名函数存储在变量中,并可以使用该变量识别该函数。
使用Function关键字创建一个匿名函数
用户可以看到在TypeScript中创建一个函数的一般语法。
function demo(param1: string, param2: number): void {
// code for the function
}
demo是上述函数中的标识符。我们可以通过删除demo这个标识符来使上述函数成为匿名函数。我们可以只使用函数关键字来定义匿名函数,并在后面的括号中加入参数。此外,我们还可以将匿名函数存储在变量中。
用户可以按照下面的语法在TypeScript中创建一个匿名函数。
语法
我们在下面的语法中把demo()函数转换为匿名的。
let demo: (param1: string, param2: string) => void = function (
param1: string,
param2: string
):
void {
// code for anonymousn function
};
现在,demo不是一个函数标识符,但它存储了一个函数。我们已经定义了demo变量的类型,它是具有两个字符串类型的参数和返回类型为void的函数。之后,我们用赋值运算符将匿名函数赋给了demo变量。
示例
在下面的例子中,我们定义了demo变量并将匿名函数存储在其中。用户可以观察到我们是如何使用demo变量来调用匿名函数的。在使用demo变量调用匿名函数时,我们还传递了两个参数。
// define a demo variable of function type taking two string parameters, and returning the none.
let demo: (param1: string, param2: string) => void = function (
param1: string,
param2: string
): void {
// code for the anonymous function
console.log("The value of the param1 is " + param1);
console.log("The value of the param2 is " + param2);
};
// calling the anonymous function via variable in which we have stored it.
demo("TutorialsPoint", "TypeScript");
在编译时,它将生成以下JavaScript代码
// define a demo variable of function type taking two string parameters, and returning the none.
var demo = function (param1, param2) {
// code for the anonymous function
console.log("The value of the param1 is " + param1);
console.log("The value of the param2 is " + param2);
};
// calling the anonymous function via variable in which we have stored it.
demo("TutorialsPoint", "TypeScript");
输出
上述代码将产生以下输出 —
The value of the param1 is TutorialsPoint
The value of the param2 is TypeScript
使用箭头函数创建一个匿名函数
箭头函数是另一种类型的匿名函数。使用箭头语法,我们可以不使用函数关键字和函数标识符来定义函数。
用户可以按照下面的语法,用箭头语法定义匿名函数,并了解为什么它被称为箭头语法。
语法
let test: function_Type = (parameters): return_type => {
// anonymous function code
}
在上述语法中,测试是一个函数类型的正常变量。这里,function_type是箭形函数的一个类型。之后,()=>{}是箭头函数的语法。此外,我们还可以在小括号中添加箭头函数的参数,并可以在大括号中编写箭头函数的代码。
示例
在下面的例子中,我们定义了测试变量,它存储了匿名的箭头函数。箭头函数在与作为参数传递的数值相乘后返回数值。
我们使用测试变量调用了箭头函数,并将其返回值存储在结果变量中。
// defining the test variable
// (value1: number) => number is the type of the test variable.
// In (value1: number): number, value1 is the parameter for the anonymous function,
// number after ':' defines the return type of anonymous function
let test: (valeu1: number) => number = (value1: number): number => {
return 10 * value1;
};
// invoking the test function
let result = test(12);
console.log("The returned value from the test function is " + result);
// defining the test variable
// (value1: number) => number is the type of the test variable.
// In (value1: number): number, value1 is the parameter for the anonymous function,
// number after ':' defines the return type of anonymous function
var test = function (value1) {
return 10 * value1;
};
// invoking the test function
var result = test(12);
console.log("The returned value from the test function is " + result);
输出
上述代码将产生以下输出 —
The returned value from the test function is 120
利用以上的语法和例子,我们已经学会了如何使用匿名函数。我们将学习在编写实时代码时匿名函数的使用。
使用匿名函数作为回调函数
在使用TypeScript时,我们经常需要在调用任何方法或函数时调用一个回调函数。我们可以将回调函数作为另一个函数的参数来传递。我们可以使用匿名箭头函数来保持回调函数的语法排序。
用户可以按照下面的语法来使用箭头函数作为回调函数。
语法
Array.sort(()=>{
// code for the callback function
})
在上面的语法中,我们使用了箭头函数作为回调函数。
示例
在这个例子中,我们已经创建了一个数字数组。之后,我们调用sort()方法将数字数组按递减的方式排序。sort()方法接受回调函数,该函数返回对数组进行排序的数字值,而回调函数是匿名的箭头函数。
// Creating the array of numbers
let numbers: Array<number> = [90, 64, 323, 322, 588, 668, 9, 121, 34, 1, 2];
// using the sort method to sort the numbers array
// To sort the numbers in the decreasing order, we need to pass callback function inside the sort method
// we have used the arrow function as a callback function inside the sort() method
numbers.sort((value1: number, value2: number): number => {
return value1 < value2 ? 1 : -1;
});
// printing the sorted numbers array
console.log(numbers);
// Creating the array of numbers
var numbers = [90, 64, 323, 322, 588, 668, 9, 121, 34, 1, 2];
// using the sort method to sort the numbers array
// To sort the numbers in the decreasing order, we need to pass callback function inside the sort method
// we have used the arrow function as a callback function inside the sort() method
numbers.sort(function (value1, value2) {
return value1 < value2 ? 1 : -1;
});
// printing the sorted numbers array
console.log(numbers);
输出
上述代码将产生以下输出 —
[ 668, 588, 323, 322, 121, 90, 64, 34, 9, 2, 1 ]
我们学会了在TypeScript中使用匿名函数。我们可以用两种方式创建匿名函数,一种是只使用函数关键字,另一种是使用箭头语法。然而,箭头语法是最好的,因为它的语法非常简短。