Xử lý lỗi trong TypeScript

Bài viết này giải thích cách xử lý lỗi trong TypeScript.

YouTube Video

Xử lý lỗi trong TypeScript

Xử lý lỗi trong TypeScript cơ bản được thực hiện bằng cách sử dụng cấu trúc try...catch, giống như trong JavaScript. Trong TypeScript, có thể quản lý nội dung lỗi rõ ràng hơn thông qua suy luận kiểu. Điều này cho phép xử lý lỗi chính xác và dễ đọc hơn.

Cú pháp try...catch

Cú pháp cơ bản để xử lý lỗi như sau:.

 1try {
 2    // Code that may throw an error
 3    throw new Error("Something went wrong!");
 4} catch (error) {
 5    // Catch and handle the error
 6    console.error("Error:", error);
 7} finally {
 8    // Code that runs regardless of whether an error occurred
 9    console.log("Finally block executed.");
10}

Xử lý lỗi an toàn loại

Trong TypeScript, lỗi được bắt trong khối catch được coi là kiểu any, nhưng nên chỉ định kiểu phù hợp để xử lý lỗi an toàn hơn. Ví dụ, bạn có thể định nghĩa và sử dụng một loại lỗi tuỳ chỉnh như sau:.

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message);
 4        this.name = "CustomError";
 5    }
 6}
 7
 8try {
 9    throw new CustomError("Invalid operation", 400);
10} catch (error) {
11    if (error instanceof CustomError) {
12        console.error(`Error: ${error.message}, Code: ${error.errorCode}`);
13    } else {
14        console.error("Unknown error occurred");
15    }
16}

Trong ví dụ này, một lớp gọi là CustomError được tạo ra và một lỗi được ném với các thuộc tính tùy chỉnh như errorCode. Trong khối catch, sử dụng instanceof để xác định loại lỗi và thực hiện xử lý phù hợp.

Xử lý lỗi bất đồng bộ

Trong TypeScript, try...catch cũng được sử dụng để xử lý lỗi khi sử dụng các hàm bất đồng bộ.

 1async function fetchData() {
 2    try {
 3        const response = await fetch("https://api.example.com/data");
 4        if (!response.ok) {
 5            throw new Error(`HTTP error! status: ${response.status}`);
 6        }
 7        const data = await response.json();
 8        console.log(data);
 9    } catch (error) {
10        console.error("Failed to fetch data:", error);
11    }
12}
13
14fetchData();

Trong ví dụ này, dữ liệu được lấy bằng fetch, và kiểm tra response.ok để ném lỗi nếu mã trạng thái không phải là OK. Lỗi được bắt trong catch, và nhật ký phù hợp sẽ được xuất ra.

Tóm tắt

Trong TypeScript, việc sử dụng các kiểu để làm rõ nội dung lỗi giúp xử lý lỗi an toàn và dễ đọc hơn. Khi xử lý lỗi, điều quan trọng là làm rõ các loại lỗi có thể xảy ra và xử lý chúng một cách phù hợp.

Lỗi

Lớp Error trong TypeScript mở rộng từ lớp Error trong JavaScript và là một đối tượng cơ bản để biểu diễn lỗi. Bằng cách sử dụng lớp Error, bạn có thể tạo một đối tượng chứa thông báo lỗi và thực hiện xử lý lỗi.

Cơ bản về lớp Error

Lớp Error được sử dụng như sau.

1const error = new Error("Something went wrong!");
2console.log(error.message); // "Something went wrong!"
3console.log(error.name);    // "Error"

Thuộc tính

Lớp Error có các thuộc tính sau:.

• message Một chuỗi dùng để biểu thị thông báo lỗi.
• name Tên của lỗi. Mặc định là "Error", nhưng có thể thay đổi bằng cách tạo một lớp lỗi tùy chỉnh.
• stack Thông tin dấu vết ngăn xếp được sử dụng cho việc gỡ lỗi. Một chuỗi chỉ ra đoạn mã nào gây ra lỗi khi nó xảy ra.

Lớp Lỗi Tùy Chỉnh

Bạn cũng có thể mở rộng lớp Error và tạo các lớp lỗi riêng của mình. Điều này rất hữu ích trong các tình huống cần xử lý lỗi cụ thể. Ví dụ, điều này hiệu quả khi bạn muốn xử lý các loại lỗi khác nhau như lỗi yêu cầu HTTP hoặc lỗi cơ sở dữ liệu.

Ví dụ về Việc Tạo Lỗi Tùy Chỉnh

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message); // Call the constructor of the parent class 'Error'
 4        this.name = "CustomError"; // Set the name of the error
 5    }
 6}
 7
 8const customError = new CustomError("Invalid operation", 400);
 9console.log(customError.message);   // "Invalid operation"
10console.log(customError.name);      // "CustomError"
11console.log(customError.errorCode); // 400

• Bằng cách tạo một lớp CustomError và thêm thông tin như mã lỗi, bạn có thể quản lý thông tin chi tiết hơn về các lỗi.

Kế Thừa Lớp Error

Trong TypeScript, khi tạo một lớp lỗi tùy chỉnh bằng cách mở rộng lớp Error, cần lưu ý một số điểm.

1. Gọi super() Trong hàm khởi tạo của lớp lỗi tùy chỉnh, bạn phải gọi super() để gọi hàm khởi tạo của lớp Error. Điều này đảm bảo rằng các thuộc tính message và stack được khởi tạo đúng cách.

2. Thêm thuộc tính Nếu bạn muốn thêm thông tin bổ sung vào đối tượng lỗi, hãy định nghĩa các thuộc tính mới trong lớp. Ví dụ, trong lớp CustomError ở trên, thuộc tính errorCode được thêm vào.

Ném và Bắt Lỗi

Bạn có thể xử lý lỗi bằng cách ném lỗi qua lớp Error hoặc một lớp lỗi tùy chỉnh, sau đó bắt chúng lại.

 1function riskyOperation() {
 2    throw new Error("Something went wrong during the operation");
 3}
 4
 5try {
 6    riskyOperation();
 7} catch (error) {
 8    if (error instanceof Error) {
 9        console.error(error.message);  // "Something went wrong during the operation"
10        console.error(error.name);     // "Error"
11    }
12}

Trong trường hợp lỗi tùy chỉnh, cũng sử dụng instanceof để xác định lỗi cụ thể và xử lý chúng một cách thích hợp.

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message);
 4        this.name = "CustomError";
 5    }
 6}
 7
 8try {
 9    throw new CustomError("Database connection failed", 500);
10} catch (error) {
11    if (error instanceof CustomError) {
12        console.error(`Error: ${error.message}, Code: ${error.errorCode}`);
13    }
14}

Tóm tắt

Lớp Error trong TypeScript là một lớp cơ bản để thực hiện xử lý lỗi tiêu chuẩn. Hơn nữa, bằng cách mở rộng lớp Error để tạo lỗi tùy chỉnh, việc xử lý lỗi linh hoạt dựa trên các loại lỗi và thông tin bổ sung trở nên khả thi.

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