JavaScript - Xử lý Lỗi và Ngoại lệ

Xin chào các pháp sư JavaScript tương lai! ? Chào mừng các bạn đến với hành trình thú vị vào thế giới xử lý lỗi trong JavaScript. Là người dạy máy tính ở khu phố gần bạn, tôi ở đây để hướng dẫn các bạn trong chuyến phiêu lưu này. Hãy cài đặt ghế của bạn và cùng tôi lặn vào!

Lỗi là gì?

Hãy tưởng tượng bạn đang nướng bánh ? và bạn vô tình sử dụng muối thay vì đường. Đó là một lỗi! Trong lập trình, lỗi cũng tương tự - chúng là những vấn đề không mong muốn xảy ra khi mã của chúng ta chạy. Những lỗi này có thể là lỗi đánh máy, sai lầm logic hoặc thậm chí là vấn đề với dữ liệu chúng ta đang làm việc.

Dưới đây là một ví dụ đơn giản về lỗi trong JavaScript:

console.log(Hello, World!);

Nếu bạn chạy đoạn mã này, bạn sẽ gặp lỗi vì chúng ta quên đặt dấu ngoặc kép xung quanh văn bản. JavaScript mong đợi các chuỗi phải ở trong ngoặc kép.

Xử lý Lỗi là gì?

Xử lý lỗi giống như có một mạng an toàn khi bạn đang đi trên dây căng. Đó là cách để chúng ta quản lý một cách nhẹ nhàng các lỗi trong mã của mình, ngăn không cho toàn bộ chương trình của chúng ta bị sập khi có điều gì đó xảy ra sai.

Câu lệnh try...catch...finally

Câu lệnh try...catch...finally là công cụ chính của chúng ta để xử lý lỗi trong JavaScript. Nó giống như một bộ ba siêu anh hùng đến để cứu ngày! ?‍♀️?‍♂️?‍♀️

Dưới đây là cách nó hoạt động:

try {
// Mã có thể gây ra lỗi
let result = 10 / 0;
console.log(result);
} catch (error) {
// Mã để xử lý lỗi
console.log("Oops! Đã xảy ra lỗi:", error.message);
} finally {
// Mã luôn chạy, không matter có lỗi hay không
console.log("Điều này luôn chạy!");
}

Trong ví dụ này:

• Khối try chứa mã có thể gây ra lỗi (chia cho không).
• Nếu có lỗi xảy ra, khối catch bắt nó và xử lý một cách nhẹ nhàng.
• Khối finally luôn chạy, có hoặc không có lỗi.

Câu lệnh throw

Đôi khi, chúng ta muốn tạo ra lỗi tùy chỉnh của riêng mình. Đó là khi câu lệnh throw trở nên hữu ích. Nó giống như bạn là trọng tài trong một trận đấu và gọi một lỗi! ?

Dưới đây là một ví dụ:

function checkAge(age) {
if (age < 0) {
throw new Error("Tuổi không thể là số âm!");
}
console.log("Tuổi hợp lệ:", age);
}

try {
checkAge(-5);
} catch (error) {
console.log("Bắt được lỗi:", error.message);
}

Trong đoạn mã này, chúng ta đang ném một lỗi tùy chỉnh khi ai đó cố gắng sử dụng tuổi âm. Khối catch sau đó xử lý lỗi này.

Thuộc tính sự kiện onerror

Thuộc tính sự kiện onerror giống như có một người bảo vệ vigilante cho toàn bộ ứng dụng JavaScript của bạn. Nó bắt lỗi xảy ra ở bất kỳ đâu trong mã của bạn.

Dưới đây là cách bạn có thể sử dụng nó:

window.onerror = function(message, source, lineno, colno, error) {
console.log("Đã xảy ra lỗi:");
console.log("Tin nhắn:", message);
console.log("Nguồn:", source);
console.log("Dòng:", lineno);
console.log("Cột:", colno);
console.log("Đối tượng lỗi:", error);
return true;
};

// Điều này sẽ kích hoạt bộ xử lý lỗi onerror
nonExistentFunction();

Đoạn mã này thiết lập một bộ xử lý lỗi toàn cục sẽ bắt bất kỳ lỗi nào chưa được bắt trong ứng dụng của bạn.

Tham chiếu đối tượng Lỗi JavaScript

JavaScript cung cấp nhiều loại lỗi内置. Hãy cùng xem chúng trong bảng sau:

Loại Lỗi	Mô tả
Error	Loại lỗi chung
SyntaxError	Xảy ra khi có lỗi cú pháp trong mã
ReferenceError	Xảy ra khi tham chiếu đến một biến không tồn tại
TypeError	Xảy ra khi giá trị không phải là loại mong đợi
RangeError	Xảy ra khi một số nằm ngoài phạm vi cho phép
URIError	Xảy ra khi sử dụng các hàm URI không chính xác
EvalError	Xảy ra liên quan đến hàm eval()

Dưới đây là một ví dụ về cách các lỗi này có thể xảy ra:

try {
// SyntaxError
eval("Hello World");

// ReferenceError
console.log(undefinedVariable);

// TypeError
null.f();

// RangeError
let arr = new Array(-1);

// URIError
decodeURIComponent("%");

} catch (error) {
console.log(error.name + ": " + error.message);
}

Mỗi dòng trong số này sẽ ném một loại lỗi khác nhau, mà khối catch của chúng ta sẽ xử lý.

Và thế là xong, các em học sinh yêu quý của tôi! Chúng ta đã đi qua vùng đất xử lý lỗi trong JavaScript. Nhớ rằng, lỗi không phải là kẻ thù của bạn - chúng là phản hồi quý giá giúp bạn cải thiện mã của mình. Hãy đón nhận chúng, học hỏi từ chúng, và sớm bạn sẽ xử lý lỗi như một chuyên gia! ?

Tiếp tục mã hóa, tiếp tục học hỏi, và đừng quên tận hưởng hành trình! Thấy các bạn trong bài học tiếp theo! ?

Credits: Image by storyset