Generics cơ bản

Generics (lập trình chung) là một trong những tính năng mạnh mẽ nhất của TypeScript. Chúng cho phép bạn viết các thành phần, chức năng và giao diện linh hoạt, có thể tái sử dụng và có thể hoạt động với các loại dữ liệu khác nhau trong khi vẫn duy trì độ an toàn loại tối đa và tránh sử dụng any.

Hàm chung

Hãy nghĩ về một cái chung như một biến cho các loại. Hãy xem xét một hàm trả về giá trị được truyền cho nó dưới dạng đối số:

function identity<T>(arg: T): T {
  return arg;
}

Chữ T (viết tắt của Type) là phần giữ chỗ cho loại. Khi chúng ta gọi identity, TypeScript sẽ ghi lại loại đối số được truyền và tự động đặt T thành loại đó:

const str = identity<string>('Hello'); // T is string
const num = identity(42); // T is number (automatically inferred!)

Giao diện chung và bí danh

Generics cũng có thể được áp dụng cho các giao diện và bí danh loại để xác định các vùng chứa hoặc cấu trúc dữ liệu chung:

interface Box<T> {
  content: T;
}

const stringBox: Box<string> = { content: 'TypeScript' };
const numberBox: Box<number> = { content: 42 };

Nhiều tham số loại

Chúng ta có thể xác định các hàm hoặc loại sử dụng nhiều biến loại (ví dụ: T và U):

function mergeObjects<T, U>(obj1: T, obj2: U): T & U {
  return { ...obj1, ...obj2 };
}

Ràng buộc chung

Đôi khi chúng ta muốn giới hạn các loại được chấp nhận bởi một generic. Chúng ta có thể sử dụng từ khóa extends để thêm ràng buộc.

Ví dụ: nếu chúng ta muốn loại chung luôn có thuộc tính length (như chuỗi hoặc mảng):

interface HasLength {
  length: number;
}

function logLength<T extends HasLength>(arg: T): void {
  console.log(arg.length); // Safe! We know arg has 'length'
}

logLength('Hello'); // Valid
logLength([1, 2, 3]); // Valid
// logLength(42); // Error: number does not have a length property!

Hãy tự mình thử

Bài tập 1: Hàm nhận dạng chung

Bài tập 2: Giấy gói hộp chung

Bài tập 3: Ràng buộc chung

Bài tập 4: Cặp chung