揭秘TypeScript函数重载：面向类型安全的编程

前端

2024-02-04 15:27:16

TypeScript函数重载：解锁面向类型安全的编程

揭开函数重载的奥秘

TypeScript函数重载是一种为同一个函数在不同情况下提供不同签名的机制。它赋予开发者编写更具可读性、可维护性和类型安全的代码的能力。

函数重载与函数重写：截然不同的概念

切勿将函数重载误认为函数重写。函数重写是指在子类中重新定义父类中的函数，而函数重载则是在同一个函数内提供多个签名。

函数重载的实战演练

示例 1：计算矩形面积

function calculateRectangleArea(width: number, height: number): number;
function calculateRectangleArea(width: number): number;

function calculateRectangleArea(width: number, height?: number): number {
  if (height === undefined) {
    return width * width;
  } else {
    return width * height;
  }
}

const squareArea = calculateRectangleArea(5); // 25
const rectangleArea = calculateRectangleArea(5, 10); // 50

在这个例子中，我们定义了一个具有两个重载的函数。第一个重载计算矩形的面积，接收两个数字参数。第二个重载计算正方形的面积，只接收一个数字参数。

示例 2：万能字符串连接函数

function concatenateStrings(...args: string[]): string;
function concatenateStrings(str1: string, str2: string): string;

function concatenateStrings(...args: string[]): string {
  return args.join('');
}

const concatenatedString1 = concatenateStrings('Hello', ' ', 'World!'); // "Hello World!"
const concatenatedString2 = concatenateStrings('a', 'b', 'c', 'd', 'e'); // "abcde"