Khi mà xảy ra một lỗi, JavaScript sẽ tự động dừng và tạo ra một thông báo lỗi.
Khi đó JavaScript sẽ ném ra một ngoại lệ (ném một lỗi).
Thực sự là JavaScript sẽ tạo một đối tượng lỗi (Error Object) với hai thuộc tính: Tên (name) và Thông báo lỗi (message).
Nhưng khí sử dụng câu lệnh throw, nó cho phép bạn tạo ra một lỗi tùy chỉnh (custom error) của mình.
Về mặt kỹ thuật một chút thì bạn có thể tự ném một ngoại lệ ra ngoài (ném một lỗi) mà bạn tạo ra.
Ngoại lệ có thể là chuỗi JavaScript, số, boolean hoặc một đối tượng. Lệnh throw thường sẽ được đặt trong try.
Ví dụ:
throw "Infinity"; //Ném ra một chuỗi
throw 0; //Ném ra một số
> Lưu ý: Sau khi câu lệnh throw được thực thi thì một lỗi sẽ đươc tạo ra, điều đó cũng đồng nghĩa với việc câu lệnh bị lỗi. Do đó, những câu lệnh sau throw sẽ không được thực thi nữa.
Ví dụ: Mình sử dụng lại đoạn code phía trên nhưng thêm vào một câu lệnh throw trước câu lệnh bị lỗi trước đó.
document.write("<h2>Lập trình JavaScript căn bản</h2>");
try {
document.write("<p>Câu lệnh try-catch trong JavaScript</p>");
throw "Lỗi này mình tạo ra nè"; // Ném ra một lỗi nè
alertrt("<p>Câu lệnh này có lỗi nè</p>"); // Cố tình để câu lệnh này có lỗi nè
document.write("<p>Câu lệnh này đúng nè</p>");
} catch (ex) {
document.write("<p>Nếu trong try có lỗi thì dòng này sẽ chạy nè</p>");
document.write(
"<p>Dòng này thông báo lỗi nè: " + ex.toString() + "</p>"
);
} finally {
document.write("<p>Cái này nó luôn chạy nè</p>");
}
Kết quả như sau:
Dòng đầu tiên sẽ chạy tức là in ra: Lập trình JavaScript căn bản.
+ Khối try:
-
Dòng lệnh thứ nhất đúng nên in ra text trên trình duyệt
-
Dòng lệnh thứ hai là dòng lệnh
throw nên nó cũng đươc xem là câu lệnh sai sẽ chuyển sang catch.
-
Các câu lệnh bên dưới sẽ dừng thực thi.
+ Khối catch:
-
Dòng lệnh thứ nhất được in ra: Điều này có nghĩa là trong
try có lỗi (Lỗi do dòng lệnh throw) thì catch mới chạy.
-
Dòng lệnh thứ hai được thực thi. Cho thấy
catch đã sẽ bắt lỗi từ throw.
+ Khối finally:
-
Tương tự như ví dụ trên. Dòng lệnh finally này là tùy chọn bạn có thể sử dụng hoặc không.
Ví dụ: Mình thử dùng throw để kiểm tra điều kiện nhập vào.
Đầu tiên ta có HTML:
<h3>Nhập một số dương nhỏ hơn 100</h3>
<input type="text" id="number" />
<button type="button" id="btn">Kiểm tra</button>
<p id="message"></p>
<script>
Bây giờ thì tạo một hàm kiểm tra dữ liệu mà người dùng nhập:
// Tạo hàm kiểm tra dữ liệu nhập vào
function checkInput() {
// Lấy số mà người dùng vừa nhập
var number = document.getElementById("number").value;
// Xử lý lỗi với try catch và throw
try {
if (number == "") {
throw "Bạn chưa nhập giá trị";
} else if (isNaN(number)) {
throw "Giá trị bạn nhập không phải là một số";
} else if (number < 1) {
throw "Giá trị vừa nhập nhỏ hơn giá trị cho phép";
} else if (number >= 100) {
throw "Giá trị vừa nhập lớn hơn giá trị cho phép";
}
document.getElementById("message").innerHTML = "Hợp lệ";
} catch (ex) {
document.getElementById("message").innerHTML = ex;
}
}
Bây giờ, ta thêm hàm xử lý này vào sự kiện click. Khi người dùng nhập xong, click vào nút Kiểm tra thì sẽ thực hiện hàm checkInput:
// Xử lý sự kiện click nút
document.getElementById("btn").addEventListener("click", checkInput);
Chạy trên trình duyệt để thử kết quả:
> Lưu ý: Câu lệnh throw có nghĩa là "NÉM" còn câu lệnh catch có nghĩa là "BẮT". Vì thế, throw ném ra cái gì thì catch bắt cái đó.