如何在 TypeScript 中使用 Lambda 表达式?


Lambda 表达式提供了一种简洁且富有表现力的方式来定义 TypeScript 中的函数,并且用途广泛,可以作为类方法、对象属性以及高阶函数中的回调函数使用。本教程旨在深入探讨 Lambda 表达式的语法,突出其相对于传统函数的优势,并提供有关如何在 TypeScript 中有效使用 Lambda 表达式的指导。

什么是 Lambda 表达式?

Lambda 表达式,通常称为箭头函数,最早在 ECMAScript 6 中引入,并在现代 JavaScript 和 TypeScript 代码中得到广泛使用。这些表达式提供了一种简洁的语法来定义这两种语言中的函数。尽管与传统的 JavaScript 函数类似,但它们也有一些明显的区别。

语法

这是在 TypeScript 中声明 Lambda 表达式/箭头函数的基本语法:

(parameter1: type, parameter2: type, ...) => expression

函数的参数由"parameter1""parameter2"等表示,它们各自的数据类型由"type"关键字指定。函数体可以是单个表达式或用花括号括起来的语句块。在前一种情况下,当调用函数时,表达式会被计算并返回。

当 Lambda 函数定义中只有一个参数时,可以省略括号。以下是一个示例:

parameter1: type => expression;

此 Lambda 表达式接受一个参数,返回的值表达式可以是单个值或用花括号括起来的语句块。

在 TypeScript 中使用 Lambda 表达式

在 TypeScript 中使用 Lambda 表达式是一个简单的过程 - 我们只需使用 "const" 或 "let" 关键字声明一个变量,然后使用 Lambda 表达式的语法。

示例 1

Lambda 表达式允许我们定义传统函数并通过使用变量名并传入相关参数来调用它们。这是一个接受三个类型为"number"的参数的"multiply"函数的示例:

// traditional function declaration
function multiplyTraditional(x: number, y: number, z: number): number {
   return x * y * z;
}
// lambda expression or arrow function declaration
const multiplyLambda = (x: number, y: number, z: number): number => x * y *z;
console.log(`The output of multiplyTraditional function is: ${multiplyTraditional(2, 2, 5)}`);
console.log(`The output of multiplyLambda function is: ${multiplyLambda(2, 2, 5)}`);

编译后,它将生成以下 JavaScript 代码:

// traditional function declaration
function multiplyTraditional(x, y, z) {
   return x * y * z;
}
// lambda expression or arrow function declaration
var multiplyLambda = function (x, y, z) { return x * y * z; };
console.log("The output of multiplyTraditional function is: ".concat(multiplyTraditional(2, 2, 5)));
console.log("The output of multiplyLambda function is: ".concat(multiplyLambda(2, 2, 5)));

输出

以上代码将产生以下输出:

The output of multiplyTraditional function is: 20
The output of multiplyLambda function is: 20

示例 2

Lambda 表达式也可用作诸如数组方法(例如,map、filter、reduce)等函数中的回调函数。这是一个演示它们与"map"方法一起使用的示例:

const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(x => x * x);
console.log(`Original array: ${numbers}`);
console.log(`Squared array: ${squaredNumbers}`);

以下 Lambda 表达式接受一个参数并返回其平方。通过使用"map"方法将此表达式应用于数组中的每个元素,会生成一个包含平方数的新数组。

编译后,它将生成以下 JavaScript 代码:

var numbers = [1, 2, 3, 4, 5];
var squaredNumbers = numbers.map(function (x) { return x * x; });
console.log("Original array: ".concat(numbers));
console.log("Squared array: ".concat(squaredNumbers));

输出

以上代码将产生以下输出:

Original array: 1,2,3,4,5
Squared array: 1,4,9,16,25

示例 3

Lambda 表达式可以在 TypeScript 中用作类方法或对象属性。下面是一个包含作为 Lambda 表达式组成的函数的类的示例:

class Calculator {
   add = (x: number, y: number, z: number): number => x + y + z;
}
const objec = new Calculator();
console.log(`The result is: ${objec.add(4, 3, 2)}`);

在此示例中,add方法(它是Calculator类的属性)被定义为 Lambda 表达式。

编译后,它将生成以下 JavaScript 代码:

var Calculator = /** @class */ (function () {
   function Calculator() {
      this.add = function (x, y, z) { return x + y + z; };
   }
   return Calculator;
}());
var objec = new Calculator();
console.log("The result is: ".concat(objec.add(4, 3, 2)));

输出

以上代码将产生以下输出:

The result is: 9

示例 4

高阶函数(接受一个或多个函数作为参数和/或返回一个函数作为结果的函数)可以使用 TypeScript 中的 Lambda 表达式方便地定义。

const applyOp = (x: number, y: number, operation: (a: number, b: number) => number) => {
   return operation(x, y);
};
const result1 = applyOp(10, 20, (a, b) => a + b); // 30
console.log(result1);
const result2 = applyOp(10, 20, (a, b) => a * b); // 200
console.log(result2);

考虑以下示例:我们将两个数字和一个函数传递给"applyOp"函数。此函数返回传递的函数的结果,该函数对两个数字参数进行操作。

编译后,它将生成以下 JavaScript 代码:

var applyOp = function (x, y, operation) {
   return operation(x, y);
};
var result1 = applyOp(10, 20, function (a, b) { return a + b; }); // 30
console.log(result1);
var result2 = applyOp(10, 20, function (a, b) { return a * b; }); // 200
console.log(result2);

输出

以上代码将产生以下输出:

30
200

示例 5

TypeScript 中的 Lambda 表达式具有词法作用域并充当闭包,这意味着它们可以访问与 Lambda 表达式相同的范围内定义的变量。一旦定义,Lambda 表达式就会捕获作用域中任何变量的值,并在以后执行时应用这些值。

这是一个演示相同的示例。

function declareCounter() {
   let count = 0;
   return () => {
      count++;
      console.log(`Current count is ${count}`);
   };
}

const counter = declareCounter();
counter();  // Current count is 1
counter(); // Current count is 2

以下示例中的"declareCounter"函数返回一个 Lambda 表达式,每次调用该表达式时都会递增并记录"count"变量。"count"变量是在与 Lambda 表达式相同的范围内定义的,使 Lambda 表达式能够访问其值并更新它。

通过调用"counter"函数两次,当前计数将记录两次,从 1 开始,每次执行 Lambda 表达式时递增 1。

编译后,它将生成与上面相同的 JavaScript 代码。

输出

JavaScript 代码将产生以下输出:

Current count is 1
Current count is 2

使用 TypeScript 中的 Lambda 表达式的优势

与传统函数相比,Lambda 表达式具有多种优势:

  • 简洁性 - 通过提供更紧凑的语法,Lambda 表达式允许我们编写更易于阅读和理解的函数。

  • 清晰度 - 当用作高阶函数(如 map 或 filter)中的回调函数时,Lambda 表达式可以使函数的目的更加明显。

  • 性能 - 由于其简化的语法,Lambda 表达式有时可能比传统函数更快,因为它们可以由 JavaScript 引擎进行优化。

  • 作用域 - Lambda 表达式具有词法作用域,使它们能够访问周围作用域中的变量,从而导致强大的编程技术,如柯里化和记忆化。

结论

TypeScript 中的 Lambda 表达式提供了多种优势,例如清晰度、简洁性、作用域和性能。它们可以用作类方法、对象属性以及高阶函数中的回调函数。通过使用简洁的语法和词法作用域,您可以创建更具表现力和模块化的代码。但是,随着 Lambda 表达式变得越来越复杂,它们可能变得难以阅读,在这种情况下,传统函数可能成为更好的选择。然而,总的来说,Lambda 表达式提高了代码的可读性和可维护性。

更新于: 2023年9月4日

6K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

立即开始
广告