Hi 🤓 Cảm ơn bạn đã ghé thăm blog này, nếu những bài viết trên blog giúp ích cho bạn. Bạn có thể giúp blog hiển thị quảng cáo bằng cách tạm ngừng ad blocker 😫 và để giúp blog duy trì hoạt động nếu bạn muốn.
Cảm ơn bạn!

Trong bài viết này, chúng ta sẽ tìm hiểu về câu lệnh throw JavaScript nhé 😁.

Trong bài viết trước, các bạn đã học cách xử lý ngoại lệ (exception) bằng cách sử dụng câu lệnh try...catch trong JavaScript. Khi sử dụng try...catch, chúng ta có thể kết hợp với câu lệnh throw để tạo các ngoại lệ theo ý muốn.

Trong JavaScript, câu lệnh throw xử lý các ngoại lệ do chúng ta tạo ra. Ví dụ: Nếu đầu vào bắt buộc là một số, nếu người dùng nhập đầu vào chứa ký tự không phải số thì chúng ta có thể sử dụng câu lệnh throw để xử lý ngoại lệ đó.

Lệnh throw trong JavaScript

Cú pháp của câu lệnh throw là:

throw <error object>;

Chúng ta có thể sử dụng bất cứ thứ gì làm error object. Nó có thể là một primitive type, như một số hoặc một chuỗi, tốt hơn là chúng ta nên sử dụng kiểu object, với các thuộc tính namemessage cho giống với các built-in error types (chứa thuộc tính name, message), ví dụ như: ReferenceError, TypeError, SyntaxError...

Ví dụ:

let error = new Error(message);
// hoặc
let error = new SyntaxError(message);
let error = new ReferenceError(message);

Đối với các built-in errors, thuộc tính name là tên của hàm tạo. Và message được lấy từ đối số.

let error = new Error("Đã có lỗi xảy ra 😪");

// tạo một ngoại lệ sử dụng built-in error
throw error.name; // Error
throw error.message; // Đã có lỗi xảy ra 😪

const number = 3;
throw number/0; // tạo một ngoại lệ khi chia cho 0

Sử dụng throw với try...catch

Khi sử dụng try...catch chúng ta có thể kết hợp với lệnh throw theo cú pháp như bên dưới:

try {
    throw exception;
} 
catch(error) {
    // viết code ở đây
}

Khi lệnh throw được thực thi, nó sẽ thoát ra khỏi khối try và chuyển vào khối catch. Lúc này, đoạn mã bên dưới lệnh throw sẽ không được thực thi.

Ví dụ:

const number = 'hi';
try {
    if(isNaN(number)) {
        // Nếu không phải số thì ném ra ngoại lệ
        throw new Error('Đây không phải là một số!');
        // code dưới này sẽ không được thực thi
    }
    else {
        console.log('Số bạn vừa nhập: ' + number);
    }

    // nếu lệnh throw thực thi, code dưới này sẽ không được thực thi
    console.log('hello');
}
catch(error) {
    console.log('Error message: ' + error);  
}

Khi chúng ta nhập một giá trị không phải số, isNaN trả về true, lúc này lệnh throw sẽ thực thi và đẩy ra một ngoại lệ. Chúng ta sử dụng built-in errorError để tạo một ngoại lệ. Sau khi throw thực thi, catch sẽ bắt được ngoại lệ này và chúng ta xử lý ngoại lệ này ở catch.

Lúc này, kiểu dữ liệu của tham số errorobject (là kiểu dữ liệu truyền ở throw).

Kết quả chúng ta được như sau:

Error message: Error: Đây không phải là một số!

Nếu ta sử dụng throw với một string thì kết quả sẽ như sau:

try {
    // throw một chuỗi trong khối try
    throw 'Đây không phải là một số!';
}
catch(error) {
    console.log('Error message: ' + error);  
}

Lúc này, kiểu dữ liệu của tham số errorstring (là kiểu dữ liệu truyền ở throw).

Chúng ta có thể sử dụng các built-in error constructors để xử lý các lỗi: TypeError, SyntaxError, ReferenceError, EvalError, InternalErrorRangeError.

Ví dụ:

throw new SyntaxError('Đã phát hiện lỗi cú pháp 🥱');

Rethrow một ngoại lệ

Chúng ta có thể sử dụng lệnh throw trong khối catch để ném lại một ngoại lệ khác.

Ví dụ:

const number = 5;
try {
     throw new Error('Có lỗi xảy ra');
}
catch(error) {
    if( number > 10) {
        console.log('Error message: ' + error); 
        console.log('Đã xử lý ngoại lệ này');
    }
    else {
        // Không thể xử lý ngoại lệ
        // Tạo một ngoại lệ khác
        throw new Error('Giá trị bạn nhập quá nhỏ 😑');
    }
}

Với giá trị 5, chúng ta có kết quả ví dụ trên là:

Uncaught Error: Giá trị bạn nhập quá nhỏ 😑

Khi chương trình chạy vào khối try, throw được thực khi. Ở catch chúng ta sẽ xử lý ngoại lệ đã nhận được. Khi number > 10 trả về false. Ta sẽ phát ra một ngoại lệ khác như ví dụ trên.

Nếu nhập giá trị number > 10 thì chương trình trả về kết quả:

Error message: Error: Có lỗi xảy ra
Đã xử lý ngoại lệ này

Lúc này, chương trình đã xử lý thành công ngoại lệ này và throw trong catch sẽ không được thực thi 😁.

Có thể bạn thích ⚡
homiedev
About Me

Hi, I'm @devnav. Một người thích chia sẻ kiến thức, đặc biệt là về Frontend 🚀. Trang web này được tạo ra nhằm giúp các bạn học Frontend hiệu quả hơn 🎉😄.

Chúc các bạn tìm được kiến thức hữu ích trong blog này 😁😁.