Thực hành tốt nhất cho logic điều kiện trong TypeScript

Bài viết này giải thích các thực hành tốt nhất cho logic điều kiện trong TypeScript.

YouTube Video

Thực hành tốt nhất cho logic điều kiện trong TypeScript

Thu hẹp kiểu dữ liệu với Type Guards

Bằng cách tận dụng hệ thống kiểu của TypeScript và sử dụng type guards trong các câu lệnh if, bạn có thể cải thiện tính an toàn và khả năng đọc của mã.

1function processInput(input: string | number) {
2    if (typeof input === "string") {
3        console.log(`String input: ${input.toUpperCase()}`);
4    } else {
5        console.log(`Number input: ${input.toFixed(2)}`);
6    }
7}

Sử dụng typeof và các type guards khác đảm bảo rằng mã trong mỗi khối an toàn về kiểu dữ liệu và phù hợp với ngữ cảnh.

Tránh các câu lệnh if lồng nhau

Các câu lệnh if lồng nhau sâu làm giảm khả năng đọc và bảo trì mã. Thay vào đó, sử dụng các lệnh trả về sớm, toán tử logic hoặc tách hàm.

Ví dụ không tốt:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (user.age) {
3        if (user.age > 18) {
4            if (user.isAdmin) {
5                console.log("User is an adult admin.");
6            }
7        }
8    }
9}

Ví dụ cải thiện:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (!user.age || user.age <= 18 || !user.isAdmin) {
3        return;
4    }
5    console.log("User is an adult admin.");
6}

Cách tiếp cận này làm phẳng mã và giúp logic dễ hiểu hơn.

Sử dụng Optional Chaining

Khi kiểm tra các thuộc tính lồng nhau, sử dụng optional chaining (?.) để tránh các điều kiện if không cần thiết.

Không sử dụng Optional Chaining:

1if (user && user.profile && user.profile.email) {
2    console.log(user.profile.email);
3}

Sử dụng Optional Chaining:

1if (user?.profile?.email) {
2    console.log(user.profile.email);
3}

Điều này giảm mã lặp và cải thiện khả năng đọc. Ở đây, mã boilerplate là mã lặp lại, tiêu chuẩn hóa thường được yêu cầu để hoàn thành các tác vụ cụ thể trong lập trình.

Sử dụng Toán tử So sánh Chặt chẽ

TypeScript hỗ trợ kiểu dữ liệu chặt chẽ, và sử dụng toán tử so sánh chặt chẽ (===) hoặc không bằng chặt chẽ (!==) giúp ngăn ngừa sự ép kiểu không mong muốn.

Ví dụ không tốt:

1if (value == "123") {
2    console.log("Value is 123.");
3}

Ví dụ cải thiện:

1if (value === "123") {
2    console.log("Value is 123.");
3}

Sử dụng Enums hoặc Literal Types cho các điều kiện rõ ràng

Sử dụng enums hoặc literal types làm rõ các điều kiện và giảm nguy cơ lỗi.

 1type Status = "success" | "error" | "loading";
 2
 3function displayMessage(status: Status) {
 4    if (status === "success") {
 5        console.log("Operation succeeded.");
 6    } else if (status === "error") {
 7        console.log("Operation failed.");
 8    } else {
 9        console.log("Loading...");
10    }
11}

Bằng cách định nghĩa các giá trị mong đợi, TypeScript có thể phát hiện kiểu dữ liệu và đảm bảo độ chính xác.

Kết hợp các điều kiện tương tự

Khi nhiều điều kiện chia sẻ cùng một logic, hãy hợp nhất chúng bằng cách sử dụng các toán tử logic hoặc câu lệnh switch.

Ví dụ không tốt:

1if (role === "admin") {
2    grantAccess();
3}
4if (role === "superadmin") {
5    grantAccess();
6}

Ví dụ cải thiện:

1if (role === "admin" || role === "superadmin") {
2    grantAccess();
3}

Hoặc, sử dụng câu lệnh switch để xử lý nhiều nhánh rõ ràng:

 1switch (role) {
 2    case "admin":
 3    case "superadmin":
 4        grantAccess();
 5        break;
 6    case "user":
 7        console.log("Limited access.");
 8        break;
 9    default:
10        console.log("No access.");
11}

Tránh làm cho các biểu thức điều kiện trở nên phức tạp

Các biểu thức điều kiện phức tạp trong câu lệnh if làm giảm khả năng đọc. Tách chúng thành các biến hoặc hàm có ý nghĩa.

Ví dụ không tốt:

1if (user.age > 18 && user.isAdmin && user.permissions.includes("write")) {
2    console.log("User can write.");
3}

Ví dụ cải thiện:

1const isAdultAdminWithWriteAccess = user.age > 18 && user.isAdmin && user.permissions.includes("write");
2if (isAdultAdminWithWriteAccess) {
3    console.log("User can write.");
4}

Đặt tên cho các điều kiện giúp cải thiện sự rõ ràng và làm cho mã có thể tự giải thích.

Sử dụng toán tử ba ngôi cho các điều kiện đơn giản

Đối với các điều kiện đơn giản, việc sử dụng toán tử ba ngôi làm cho mã gọn gàng hơn.

Ví dụ:

1const message = isLoggedIn ? "Welcome back!" : "Please log in.";
2console.log(message);

Tuy nhiên, tránh sử dụng toán tử ba ngôi cho các điều kiện phức tạp vì nó làm giảm khả năng đọc.

Kết luận

Bằng cách tuân theo các thực hành tốt nhất này, bạn có thể làm cho các câu lệnh if trong TypeScript trở nên rõ ràng, hiệu quả và dễ bảo trì. Tận dụng các tính năng của TypeScript như type guards, optional chaining và enums để cải thiện khả năng đọc và độ bền của mã của bạn. Giữ cho các điều kiện ngắn gọn và rõ ràng, hướng đến mã luôn dễ hiểu và bảo trì.

Bạn có thể làm theo bài viết trên bằng cách sử dụng Visual Studio Code trên kênh YouTube của chúng tôi. Vui lòng ghé thăm kênh YouTube.

YouTube Video