Function Overload | Lập trình TypeScript

Function overloading cho phép bạn định nghĩa nhiều signatures cho một function và cung cấp một hàm thực thi sẽ xử lý các chữ ký đó. Function overloading cho phép một function xử lý các đối số có kiểu khác nhau. Ngoài ra trình biên dịch của TypeScript dùng function signatures để tiến hành kiểm tra kiểu trong thời gian biên dịch, đảm bảo sự an toàn kiểu dữ liệu.
Ví dụ

// Example Function Overloading
function add(p1: number, p2: number): number;
function add(p1: string, p2: string): string;

function add(p1: any, p2: any): any {
  if (typeof p1 === "number" && typeof p2 === "number") {
    return p1 + p2;
  } else if (typeof p1 === "string" && typeof p2 === "string") {
    return p1 + p2;
  }
  throw new Error("Invalid arguments");
}

console.log(add(1, 2)); // 3
console.log(add("Hello ", "World !")); // Hello World !

Giải thích code trên: ban đầu tạo hai function signatures, một là có hai tham số kiểu number kiểu trả về là number, một là có hai tham số kiểu string kiểu trả về là string. Tiếp theo viết function thực thi, với hai tham số nhận kiểu any và kiểu trả về cũng là any, bên trong sẽ kiểm tra kiểu nếu cả hai tham số là cùng kiểu number hoặc cùng kiểu string thì mới cho phép thực hiện toán tử +, nếu số thì cộng hai số và nếu là chuỗi thì nối hai chuỗi.

Function overloading với optional parameters

// Function overloading with optional parmeters
function sum(p1: number, p2: number): number;
function sum(p1: number, p2: number, p3: number): number;

function sum(p1: number, p2: number, p3?: number): number {
  if (p3) return p1 + p2 + p3; // Check p3 is valid
  return p1 + p2; // Sum p1 and p2 while p3 invalid
}
console.log(sum(1, 5, 6)); // 12
console.log(sum(1, 6)); // 7

Giải thích: như đề cập hàm thực thi phải xử lý tất cả các signatures mà nó tạo ra, trong trường hợp này hàm thực thi phải thực hiện hai chữ ký có số lượng params khác nhau cho nên tham số nhiều hơn phải ở trạng thái optional (tùy chọn). Trường hợp này p3 phải được đánh dấu optional (?)

Method overloading

Khi một function là một thuộc tính của class thì nó được gọi là method. TS cũng hỗ trợ method overloading

// Method Overloading
class Counter {
  // Class members
  private current = 0;
  count(): number;
  count(target: number): number[];

  // Implement
  count(target?: number): number | number[] {
    if (target) {
      let values: number[] = [];
      for (let start = this.current; start <= target; start++) {
        values.push(start);
      }
      this.current = target;
      return values;
    }
    return ++this.current;
  }
}

// Create new Object
let cnt = new Counter();
console.log(cnt.count());
console.log(cnt.count(5));
console.log(cnt.count(10));

Giải thích code: ta có một class tên là Counter và chứa hai signatures count (line 5 và 6) sau đó method thực thi sẽ có tham số target là tùy chọn và kiểu trả về là union (number và array number). Kết quả thu được

1
[ 1, 2, 3, 4, 5 ]
[ 5, 6, 7, 8, 9, 10 ]

Tóm lại
Function overloading là việc tạo ra nhiều signature cho một hàm thực thi xử lý một lần