Utility types phổ biến trong Typescript

Trong bài viết này, mình sẽ tìm hiểu về các utility types phổ biến trong TypeScript, bao gồm Partial, Required, Readonly, Mutable, Omit, Pick, Exclude, Extract, Parameters, ReturnType, Awaited, và NonNullable. Mình sẽ cùng nhau tìm hiểu về cách sử dụng và cách mỗi utility type có thể giúp bạn quản lý kiểu dữ liệu trong mã nguồn TypeScript của mình.

Utility Types phổ biến

Dưới đây là một mô tả tóm tắt về mỗi kiểu tiện ích và các ví dụ minh họa để bạn có cái nhìn cụ thể hơn về cách chúng hoạt động:

Partial

Utility type Partial cho phép bạn tạo ra một kiểu dữ liệu mới bằng việc loại bỏ tính bắt buộc (required) của các thuộc tính trong một kiểu dữ liệu hiện có. Điều này có nghĩa là bạn có thể tạo một kiểu dữ liệu mà không yêu cầu phải điền đầy đủ thông tin.

Ví dụ:

Bài viết này được đăng tại [free tuts .net]

type PartialUser = Partial<User>;

const partialUser: PartialUser = {
  name: "John",
  age: 30,
};

Required

Ngược lại với Partial, Required cho phép bạn tạo một kiểu dữ liệu mới trong đó tất cả các thuộc tính đều là bắt buộc.

Ví dụ:

type RequiredUser = Required<User>;

const requiredUser: RequiredUser = {
  name: "Alice",
  age: 25,
};

Readonly

Utility type Readonly biến đổi một kiểu dữ liệu sao cho tất cả các thuộc tính của nó trở thành chỉ đọc.

Ví dụ:

type ReadonlyUser = Readonly<User>;

const readonlyUser: ReadonlyUser = {
  name: "Bob",
  age: 35,
};

// readonlyUser.name = "Charlie"; // Lỗi, không thể gán lại giá trị thuộc tính

Mutable

Ngược lại với Readonly, Mutable cho phép bạn biến đổi một kiểu dữ liệu sao cho tất cả các thuộc tính của nó trở thành có thể chỉnh sửa.

Ví dụ:

type MutableUser = Mutable<ReadonlyUser>;

const mutableUser: MutableUser = {
  name: "David",
  age: 40,
};

mutableUser.name = "Eve"; // Đúng, có thể chỉnh sửa giá trị thuộc tính

Omit

Omit cho phép bạn tạo ra một kiểu dữ liệu mới bằng cách loại bỏ một hoặc nhiều thuộc tính khỏi kiểu dữ liệu hiện có.

Ví dụ:

type OmittedUser = Omit<User, "name">;

const omittedUser: OmittedUser = {
  age: 50,
};

Pick

Pick cho phép bạn tạo ra một kiểu dữ liệu mới bằng cách lựa chọn một hoặc nhiều thuộc tính từ kiểu dữ liệu hiện có.

Ví dụ:

type PickedUser = Pick<User, "name">;

const pickedUser: PickedUser = {
  name: "Frank",
};

Exclude

Utility type Exclude loại bỏ các kiểu từ một kiểu union (hợp nhất). Nó rất hữu ích khi bạn muốn loại trừ một số kiểu khỏi kiểu union.

Ví dụ:

type ExcludedNumbers = Exclude<number | string, string>;

const excludedNumber: ExcludedNumbers = 42;

Extract

Extract là tương tự như Exclude, nhưng ngược lại. Nó chỉ giữ lại các kiểu bạn muốn từ một kiểu union.

Ví dụ:

type ExtractedStrings = Extract<number | string, string>;

const extractedString: ExtractedStrings = "Hello";

Các utility types còn lại cũng có chức năng và ví dụ tương tự, và chúng sẽ giúp bạn tận dụng sức mạnh của TypeScript để quản lý kiểu dữ liệu một cách hiệu quả và bảo vệ mã nguồn khỏi lỗi loại kiểu.

Cách sử dụng mỗi Utility Type

Cách sử dụng mỗi utility type sẽ phụ thuộc vào tình huống cụ thể mà bạn đang gặp phải trong mã nguồn TypeScript của mình. Dưới đây là cách bạn có thể sử dụng mỗi loại:

• Partial: Sử dụng khi bạn muốn tạo một phiên bản của một kiểu dữ liệu mà không yêu cầu phải điền đầy đủ thông tin. Thích hợp khi bạn muốn cho phép một phần thông tin bị thiếu.

• Required: Ngược lại với Partial, sử dụng khi bạn muốn tất cả thuộc tính trong kiểu dữ liệu phải được điền đầy đủ thông tin.

• Readonly: Sử dụng khi bạn muốn đảm bảo rằng giá trị của các thuộc tính không thể bị thay đổi sau khi được khởi tạo.

• Mutable: Sử dụng để bỏ giới hạn chỉ đọc của các thuộc tính, cho phép bạn chỉnh sửa chúng sau khi được khởi tạo.

• Omit: Sử dụng khi bạn muốn tạo một kiểu dữ liệu mới bằng cách loại bỏ một hoặc nhiều thuộc tính từ một kiểu dữ liệu hiện có.

• Pick: Sử dụng khi bạn muốn tạo một kiểu dữ liệu mới bằng cách chọn một hoặc nhiều thuộc tính từ một kiểu dữ liệu hiện có.

• Exclude: Sử dụng khi bạn muốn loại bỏ các kiểu từ một kiểu union.

• Extract: Sử dụng khi bạn muốn giữ lại các kiểu bạn quan tâm từ một kiểu union.

• Parameters: Sử dụng khi bạn muốn trích xuất kiểu của các tham số từ kiểu hàm.

• ReturnType: Sử dụng khi bạn muốn trích xuất kiểu dữ liệu trả về từ kiểu hàm.

• Awaited: Sử dụng khi bạn muốn trích xuất kiểu dữ liệu mà một Promise trả về sau khi được giải quyết.

• NonNullable: Sử dụng khi bạn muốn loại bỏ kiểu null và undefined từ một kiểu dữ liệu union.

Ví dụ minh họa

Dưới đây là ví dụ về cách sử dụng một số utility types:

type User = {
  name: string;
  age?: number;
};

type PartialUser = Partial<User>;
type RequiredUser = Required<User>;
type ReadonlyUser = Readonly<User>;
type MutableUser = Mutable<ReadonlyUser>;
type OmittedUser = Omit<User, "name">;
type PickedUser = Pick<User, "name">;
type ExcludedNumbers = Exclude<number | string, string>;
type ExtractedStrings = Extract<number | string, string>;
type FunctionParameters = Parameters<(x: number, y: string) => boolean>;
type FunctionReturnType = ReturnType<(x: number, y: string) => boolean>;
type AwaitedPromise = Awaited<Promise<string | number>>;
type NonNullableValues = NonNullable<string | null | number>;

Lợi ích và hạn chế của việc sử dụng Utility Types

Lợi ích của việc sử dụng Utility Types:

• Đảm bảo tính chính xác và an toàn của kiểu dữ liệu: Utility types giúp đảm bảo rằng kiểu dữ liệu được sử dụng đúng cách và giúp tránh các lỗi loại kiểu tại thời điểm biên dịch.

• Tái sử dụng mã nguồn: Sử dụng utility types giúp bạn viết mã nguồn một cách thông minh và tái sử dụng kiểu dữ liệu trong nhiều tình huống khác nhau mà không cần phải viết lại nhiều mã.

Hạn chế của việc sử dụng Utility Types:

• Tùy chỉnh hạn chế: Mặc dù utility types mạnh mẽ, nhưng chúng có thể không phù hợp cho mọi tình huống. Bạn có thể cần tạo ra các kiểu tùy chỉnh khi cần sử dụng logic phức tạp hơn.

• Khả năng hiểu lỗi cần cải thiện: Đôi khi, thông báo lỗi từ TypeScript có thể không rõ ràng khi sử dụng utility types, đặc biệt khi bạn tạo ra các kiểu dữ liệu phức tạp.

Kết bài

Trong bài viết này, mình đã tìm hiểu về utility types trong TypeScript, bao gồm một loạt các loại utility type như Partial, Required, Readonly, Mutable, Omit, Pick, Exclude, Extract, Parameters, ReturnType, Awaited, và NonNullable. Mình đã thấy cách sử dụng mỗi loại utility type, điều này có thể giúp bạn kiểm tra và biến đổi kiểu dữ liệu dễ dàng hơn. Mình cũng đã thấy rõ lợi ích và hạn chế của việc sử dụng utility types, cũng như cách chúng có thể giúp bạn cải thiện tính chính xác và tái sử dụng mã nguồn trong các dự án TypeScript của bạn.

Sử dụng utility types cùng với kiến thức về TypeScript sẽ giúp bạn viết mã nguồn hiệu quả hơn và giảm thiểu các lỗi kiểu dữ liệu, đồng thời tạo ra mã có tính bảo mật cao hơn. Hy vọng rằng việc tìm hiểu về utility types sẽ giúp bạn trở thành một lập trình viên TypeScript thành thạo hơn.