TypeScript - Type Aliases: A Beginner's Guide

Xin chào bạn, ngôi sao lập trình tương lai! ? Bạn đã sẵn sàng bắt đầu một hành trình thú vị vào thế giới của TypeScript chưa? Hôm nay, chúng ta sẽ khám phá một tính năng tuyệt vời叫做 Type Aliases. Đừng lo lắng nếu bạn mới bắt đầu học lập trình - tôi sẽ là người hướng dẫn thân thiện của bạn, và chúng ta sẽ cùng nhau học từng bước. Vậy, hãy lấy đồ uống yêu thích của bạn, thư giãn và cùng tôi bước vào!

What Are Type Aliases?

Trước khi chúng ta đi sâu vào chi tiết, hãy hiểu Type Aliases là gì. Hãy tưởng tượng bạn có một bộ quần áo yêu thích mà bạn thường xuyên mặc. Thay vì mô tả chi tiết mỗi lần ("quần jeans xanh của tôi với áo thun trắng và giày đỏ"), bạn có thể gọi nó bằng một biệt danh như " phong cách casual của tôi". Type Aliases hoạt động tương tự trong TypeScript - chúng cho phép chúng ta đặt tên cho một kiểu để có thể sử dụng nó dễ dàng hơn sau này.

Syntax: How to Create a Type Alias

Việc tạo một Type Alias rất đơn giản. Đây là cú pháp cơ bản:

type AliasName = ExistingType;

Hãy phân tích nó:

• type: Từ khóa này告诉 TypeScript chúng ta đang tạo một Type Alias.
• AliasName: Đây là tên bạn chọn cho alias của bạn. Hãy làm cho nó mô tả!
• ExistingType: Đây là kiểu mà bạn đang tạo alias cho.

Aliasing Primitive Types

Hãy bắt đầu với điều đơn giản. TypeScript có các kiểu nguyên thủy như string, number, và boolean. Chúng ta có thể tạo alias cho chúng:

type Username = string;
type Age = number;
type IsActive = boolean;

let newUser: Username = "CodingNewbie123";
let userAge: Age = 25;
let accountActive: IsActive = true;

Trong ví dụ này, chúng ta đã tạo alias cho các kiểu cơ bản. Bây giờ, Username chỉ là một cách khác để nói string, Age có nghĩa là number, và IsActive tương đương với boolean. Điều này có thể看起来 không cần thiết cho các kiểu đơn giản, nhưng nó có thể làm cho mã của bạn dễ đọc hơn và có ý nghĩa hơn, đặc biệt là trong các dự án lớn.

Aliasing Union Types

Bây giờ, hãy nâng cấp! Các kiểu union cho phép một giá trị có thể là một trong někol� loại. Chúng ta cũng có thể tạo alias cho chúng:

type Status = "active" | "inactive" | "suspended";
type NumericId = number | string;

let userStatus: Status = "active";
let userId: NumericId = 12345;
userId = "USER12345"; // Điều này cũng hợp lệ

Ở đây, Status chỉ có thể là một trong ba chuỗi cụ thể, trong khi NumericId có thể là số hoặc chuỗi. Điều này rất hữu ích khi bạn có một giá trị có thể là nhiều kiểu khác nhau nhưng trong một tập hợp cụ thể.

Aliasing Tuples

Tuples giống như mảng có số lượng phần tử cố định, nơi mỗi phần tử có thể có một kiểu khác nhau. Chúng ta cũng có thể alias chúng:

type Coordinate = [number, number];
type NameAge = [string, number];

let position: Coordinate = [10, 20];
let person: NameAge = ["Alice", 30];

Trong ví dụ này, Coordinate luôn có hai số, và NameAge luôn có một chuỗi theo sau là một số. Điều này rất tốt cho khi bạn có dữ liệu luôn đến theo cặp hoặc theo序列.

Aliasing Object Types

Object là nơi Type Aliases thực sự tỏa sáng. Chúng có thể làm cho các kiểu phức tạp dễ quản lý hơn:

type User = {
id: number;
name: string;
email: string;
isAdmin: boolean;
};

let newAdmin: User = {
id: 1,
name: "Super Admin",
email: "[email protected]",
isAdmin: true
};

Bây giờ, thay vì viết cấu trúc object đó mỗi lần, chúng ta chỉ cần sử dụng User. Điều này giống như tạo một bản đồ cho object người dùng của chúng ta.

Aliasing Function Types

Bạn có biết chúng ta thậm chí có thể tạo alias cho các kiểu hàm không? Hãy kiểm tra điều này:

type GreetingFunction = (name: string) => string;

let greet: GreetingFunction = (name) => `Hello, ${name}!`;

console.log(greet("TypeScript Learner")); // Xuất: Hello, TypeScript Learner!

Ở đây, GreetingFunction là alias cho bất kỳ hàm nào nhận một chuỗi và trả về một chuỗi. Điều này rất hữu ích khi bạn làm việc với các callback hoặc muốn đảm bảo tính nhất quán giữa nhiều hàm.

Using Type Aliases with Generics

Cuối cùng nhưng không kém phần quan trọng, hãy nói về việc sử dụng Type Aliases với generics. Generics cho phép chúng ta tạo mã linh hoạt, tái sử dụng:

type Container<T> = { value: T };

let numberContainer: Container<number> = { value: 42 };
let stringContainer: Container<string> = { value: "Hello, TypeScript!" };

Trong ví dụ này, Container là một kiểu generic có thể giữ bất kỳ kiểu giá trị nào. Chúng ta sử dụng <T> làm placeholder, và sau đó xác định kiểu thực tế khi chúng ta sử dụng nó.

Wrapping Up

Uf! Chúng ta đã bao gồm rất nhiều nội dung hôm nay. Type Aliases giống như cây kéo đa năng của bạn trong TypeScript - chúng có thể làm cho mã của bạn sạch sẽ hơn, dễ đọc hơn và dễ bảo trì hơn. Nhớ rằng mục tiêu là viết mã không chỉ hoạt động mà còn dễ hiểu cho bạn (và người khác) sau này.

Dưới đây là bảng tham khảo nhanh của tất cả các phương pháp Type Alias chúng ta đã bao gồm:

Phương pháp	Mô tả	Ví dụ
Primitive Types	Aliasing các kiểu cơ bản	type Age = number;
Union Types	Aliasing một union của các kiểu	type Status = "active" \| "inactive";
Tuples	Aliasing các mảng có độ dài cố định	type Coordinate = [number, number];
Object Types	Aliasing cấu trúc object	type User = { name: string, age: number };
Function Types	Aliasing các chữ ký hàm	type Greeter = (name: string) => string;
Generics	Tạo các alias linh hoạt	type Container<T> = { value: T };

Thực hành các khái niệm này, thử nghiệm với các alias của riêng bạn, và sớm bạn sẽ sử dụng Type Aliases như một chuyên gia! Nhớ rằng, mỗi master coder đều bắt đầu từ một người mới bắt đầu. Hãy tiếp tục lập trình, 保持好奇心, và chúc may mắn với TypeScript! ??‍??‍?

Credits: Image by storyset