try คำสั่งช่วยให้คุณทดสอบบล็อกของรหัสสำหรับข้อผิดพลาด
catch คำสั่งช่วยให้คุณจัดการกับข้อผิดพลาด
throw งบช่วยให้คุณสร้างข้อผิดพลาดที่กำหนดเอง
คำสั่งในที่สุดก็ช่วยให้คุณสามารถรันโค้ดหลังจากลองและจับโดยไม่คำนึงถึงผลที่ตามมา
ข้อผิดพลาดที่จะเกิดขึ้น!
เมื่อรัน JavaScript รหัสข้อผิดพลาดที่แตกต่างกันสามารถเกิดขึ้นได้
ข้อผิดพลาดสามารถเข้ารหัสข้อผิดพลาดที่ทำโดยโปรแกรมเมอร์ข้อผิดพลาดอันเนื่องมาจากการป้อนข้อมูลที่ไม่ถูกต้องและสิ่งที่คาดเดาอื่น ๆ :
ตัวอย่าง
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
try {
adddlert("Welcome guest!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
</script>
</body>
</html> ลองตัวเอง» ในตัวอย่างข้างต้นเราได้พิมพ์ผิดในรหัส (ในบล็อกลองบริการ)
catch บล็อก catches ข้อผิดพลาดและรันโค้ดเพื่อจัดการกับมัน
JavaScript try และ catch
try คำสั่งช่วยให้คุณกำหนดบล็อกของรหัสที่จะทดสอบสำหรับข้อผิดพลาดในขณะที่มันจะถูกดำเนินการ
catch คำสั่งช่วยให้คุณกำหนดบล็อกของรหัสที่จะดำเนินการหากมีข้อผิดพลาดเกิดขึ้นในบล็อกลอง
งบ JavaScript try และ catch มาเป็นคู่:
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
JavaScript สามารถยกข้อผิดพลาด
เมื่อเกิดข้อผิดพลาด, JavaScript ปกติจะหยุดและสร้างข้อผิดพลาด
ระยะทางเทคนิคสำหรับเรื่องนี้คือ: JavaScript จะเพิ่ม (หรือโยน) ข้อยกเว้น
throw งบ
throw งบช่วยให้คุณสร้างข้อผิดพลาดที่กำหนดเอง
ในทางเทคนิคคุณสามารถเพิ่ม (โยน) ข้อยกเว้น
ยกเว้นในกรณีที่อาจจะเป็นสตริง JavaScript, จำนวน, บูลีนหรือวัตถุ:
throw "Too big"; // throw a text
throw 500; // throw a numberถ้าคุณใช้ throw พร้อมกับ try และ catch คุณสามารถควบคุมการไหลของโปรแกรมและสร้างข้อความผิดพลาดที่กำหนดเอง
การป้อนข้อมูลตัวอย่างการตรวจสอบ
ตัวอย่างเช่นนี้จะตรวจสอบการป้อนข้อมูล ถ้าค่าที่ไม่ถูกต้องข้อยกเว้น (ผิดพลาด) จะถูกโยนทิ้ง
ข้อยกเว้น (ผิดพลาด) ที่ถูกจับได้โดยการตรวจจับคำสั่งและข้อผิดพลาดที่กำหนดเองจะแสดง:
<!DOCTYPE html>
<html>
<body>
<p>Please input a number between
5 and 10:</p>
<input id="demo" type="text">
<button type="button"
onclick="myFunction()">Test Input</button>
<p id="message"></p>
<script>
function myFunction() {
var message, x;
message =
document.getElementById("message");
message.innerHTML = "";
x =
document.getElementById("demo").value;
try {
if(x == "") throw "empty";
if(isNaN(x)) throw "not a number";
x = Number(x);
if(x < 5) throw
"too low";
if(x > 10) throw "too
high";
}
catch(err) {
message.innerHTML =
"Input is " + err;
}
}
</script>
</body>
</html> ลองตัวเอง» การตรวจสอบ HTML
รหัสข้างต้นเป็นเพียงตัวอย่าง
เบราว์เซอร์สมัยใหม่มักจะใช้การรวมกันของ JavaScript และในตัวตรวจสอบ HTML โดยใช้กฎการตรวจสอบที่กำหนดไว้ล่วงหน้าที่กำหนดไว้ใน HTML แอตทริบิวต์:
<input id="demo" type="number" min="5" max="10" step="1"คุณสามารถอ่านเพิ่มเติมเกี่ยวกับการตรวจสอบรูปแบบในบทต่อมาของการกวดวิชานี้
finally คำชี้แจง
finally คำสั่งช่วยให้คุณสามารถรันโค้ดหลังจาก try และ catch โดยไม่คำนึงถึงผลที่ได้:
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
finally {
Block of code to be
executed regardless of the try / catch result
}ตัวอย่าง
function myFunction() {
var message,
x;
message =
document.getElementById("message");
message.innerHTML = "";
x =
document.getElementById("demo").value;
try {
if(x == "") throw "is empty";
if(isNaN(x))
throw "is not a number";
x = Number(x);
if(x >
10) throw "is too high";
if(x <
5) throw "is too low";
}
catch(err)
{
message.innerHTML = "Error: " +
err + ".";
}
finally {
document.getElementById("demo").value
= "";
}
} ลองตัวเอง»