JavaScript ลองจับ:คำแนะนำทีละขั้นตอน

JavaScript พยายามบล็อก catch เป็นตัวจัดการข้อผิดพลาด บล็อก "ลอง" มีรหัสที่คุณต้องการทดสอบ “catch” มีรหัสที่จะเรียกใช้หากรหัสในบล็อก “ลอง” ของคุณไม่สามารถดำเนินการได้สำเร็จ

เมื่อนักพัฒนาทำการทดสอบโปรแกรม เป็นเรื่องปกติที่จะเขียนโค้ดที่จัดการกับข้อผิดพลาดในบางวิธี สิ่งนี้มีความสง่างามมากกว่าการปล่อยให้โปรแกรมหยุดทำงาน ซึ่งจะทำให้เกิดข้อผิดพลาดในการเขียนโปรแกรมปรากฏในโปรแกรมของพวกเขา ตัวอย่างเช่น คุณอาจต้องการให้ผู้ใช้เห็นข้อความ "โปรดลองอีกครั้งในภายหลัง" แทนที่จะเป็นบันทึกข้อผิดพลาดที่ยาว

นั่นคือสิ่งที่บล็อก try/catch เข้ามา บล็อก Try/catch ช่วยให้คุณจัดการกับข้อผิดพลาดได้อย่างสวยงาม เพื่อที่ปัญหาในการเขียนโปรแกรมจะไม่ทำให้โปรแกรมทั้งหมดขัดข้อง ในคู่มือนี้ เราจะสาธิตวิธีใช้บล็อก try/catch และพูดคุยว่ามีประโยชน์อย่างไร

ข้อผิดพลาดในการจัดการทบทวน

นักพัฒนาทุกคนทำผิดพลาดในโค้ดของพวกเขา เพราะมีหลายวิธีที่โปรแกรมสามารถพังได้

เมื่อพบข้อผิดพลาดใน JavaScript โปรแกรมมักจะหยุดและพิมพ์ข้อผิดพลาดไปที่คอนโซล สิ่งนี้มีประโยชน์เพราะคุณสามารถเห็นสิ่งผิดปกติ แต่ผู้ใช้ที่พบข้อผิดพลาดมักจะไม่เข้าใจ

ด้วยเหตุนี้จึงเป็นสิ่งสำคัญที่จะรวมขั้นตอนการจัดการข้อผิดพลาดในโค้ดของคุณ ด้วยการรวมตัวจัดการข้อผิดพลาด คุณสามารถปรับแต่งวิธีที่โปรแกรมของคุณตอบสนองหากพบข้อผิดพลาด ดังนั้น ตัวจัดการข้อผิดพลาดช่วยให้คุณตัดสินใจได้ว่าข้อความใดที่ผู้ใช้เห็นเมื่อพบข้อผิดพลาด หรือวิธีแจ้งให้คุณทราบถึงปัญหา

JavaScript ลองจับ

JavaScript try catch block ระบุข้อผิดพลาดในบล็อกของรหัสที่ระบุ เนื้อหาของบล็อก "จับ" จะทำงานหากมีข้อผิดพลาดในโค้ดในบล็อก "ลอง" ของคุณ คุณยังสามารถใช้บล็อก "สุดท้าย" เพื่อเรียกใช้โค้ดไม่ว่าโปรแกรมของคุณจะรันได้สำเร็จหรือไม่

นี่คือไวยากรณ์สำหรับขั้นตอน try/catch:

81% ของผู้เข้าร่วมกล่าวว่าพวกเขารู้สึกมั่นใจมากขึ้นเกี่ยวกับโอกาสในการทำงานด้านเทคโนโลยีหลังจากเข้าร่วม bootcamp จับคู่กับ Bootcamp วันนี้

ผู้สำเร็จการศึกษาจากหลักสูตร bootcamp โดยเฉลี่ยใช้เวลาน้อยกว่าหกเดือนในการเปลี่ยนอาชีพ ตั้งแต่เริ่มต้น bootcamp ไปจนถึงหางานแรก

try {
	// Your code here
	console.log(“The code works!”);
} catch (e) {
	console.log(“There is a problem in my code!”);
}

มีสองข้อความในกลุ่มของเรา:

• ลอง {}.
• จับ (จ) {}.

รหัสที่อยู่ในคำสั่ง "ลอง" คือสิ่งที่โปรแกรมจะพยายามเรียกใช้ ในกรณีนี้ โปรแกรมของเราพยายามที่จะพิมพ์ “รหัสนี้ใช้ได้” ไปที่คอนโซล รหัสที่อยู่ใน จับ คำสั่งทำงานหากและเมื่อมีการส่งคืนข้อผิดพลาดใน ลอง . ของคุณ คำสั่ง

ค่า (e) ในคำสั่ง catch แสดงถึงข้อผิดพลาดที่ทำให้โค้ดในคำสั่ง "try" ล้มเหลว คุณอาจตัดสินใจพิมพ์ค่า "e" ออกมา เพื่อดูสาเหตุที่แท้จริงของข้อผิดพลาดที่หยุดโค้ดของคุณ

ลองจับตัวอย่าง JavaScript

เพื่อแสดงตัวอย่างการใช้งานบล็อคลอง/จับ ในตัวอย่างด้านล่าง เราสะกดชื่อตัวแปร JavaScript ในโค้ดของเราผิด

let ourVariable = “Test”;
console.log(ourVarible);

รหัสของเราส่งคืน:

ReferenceError: ourVarible is not defined

นี่เป็นข้อผิดพลาดเริ่มต้นที่ส่งคืนเมื่อไม่พบตัวแปร แต่ถ้าผู้ใช้เห็นข้อผิดพลาดนี้ล่ะ พวกเขาคงจะสับสน ตอนนี้ มาลองใช้โค้ดของเราโดยใช้บล็อก try/catch:

let ourVariable = “Test”;
try {
console.log(ourVarible);
} catch (e) {
	console.log(“There is a problem!”)
}

รหัสของเราส่งคืน:

There is a problem!

รหัสของเรามี ReferenceError เดียวกันกับที่เราได้เห็นด้านบน แต่แทนที่จะส่งคืนข้อผิดพลาดเริ่มต้นที่ยาวและซับซ้อน โปรแกรมของเราส่งคืนสิ่งที่เราระบุไว้ใน catch บล็อก. รหัสของเราบันทึกข้อผิดพลาด แต่โปรแกรมส่งคืนข้อผิดพลาดที่เรากำหนดเองแทน

บล็อก catch จะติดตามข้อผิดพลาดของเราในอาร์กิวเมนต์ "e" หากเราต้องการ เรายังคงสามารถเข้าถึงข้อผิดพลาดที่ส่งคืนได้ ต่อไปนี้คือตัวอย่างโปรแกรมที่คืนค่า “e”:

let ourVariable = “Test”;
try {
console.log(ourVarible);
} catch (e) {
	console.log(“There is a problem! Here is the error message from the code:”, e)
}

รหัสของเราส่งคืนดังต่อไปนี้:

There is a problem! Here is the error message from the code: ReferenceError: ourVarible is not defined.

ตอนนี้โค้ดของเราจะรายงานข้อผิดพลาดให้เราทราบและยังแสดงข้อความแสดงข้อผิดพลาดที่โปรแกรมส่งมาด้วย

เป็นที่น่าสังเกตว่า จับ ข้อเป็นตัวเลือก หากคุณต้องการให้โปรแกรมของคุณไม่ทำอะไรเลยหากพบข้อผิดพลาด คุณจะต้องใส่รหัสของคุณใน ลอง บล็อค

JavaScript ลองจับข้อสุดท้าย

มีอีกหนึ่งประโยคที่เราสามารถเพิ่มลงในโค้ดของเราได้:ในที่สุด สุดท้าย เป็นประโยคทางเลือก เช่น catch และช่วยให้เราสามารถเรียกใช้โค้ดได้แม้ในขณะที่พบข้อผิดพลาด ต่อไปนี้คือตัวอย่างการทำงานของคำสั่ง try/catch/finally:

let ourVariable = "Test";
try {
console.log(ourVarible);
} catch (e) {
console.log("There is a problem! Here is the error message from the code:", e)
} finally {
	console.log("The code has been run!")
}

นี่คือสิ่งที่โปรแกรมของเราส่งคืน:

TypeError: Your variable is not a string!
The code has been run!

รหัสของเราพบข้อผิดพลาด ดังนั้นรหัสภายใน จับ . ของเรา ประโยคทำงาน ส่งคืน TypeError ที่เราเห็นด้านบน หลังจากจัดการข้อผิดพลาดแล้ว รหัสใน สุดท้าย . ของเรา มีการเรียกใช้บล็อกซึ่งพิมพ์ รหัสนี้ถูกเรียกใช้แล้ว!

บทสรุป

คุณสามารถใช้คำสั่ง try/catch ของ JavaScript เพื่อทดสอบโค้ดของคุณได้ เนื้อหาของคำสั่ง catch จะทำงานหากคำสั่ง try ของคุณไม่สามารถดำเนินการได้สำเร็จ คำสั่งสุดท้ายจะดำเนินการทันทีหลังจากคำสั่ง try หรือ catch

หากคุณกำลังพัฒนาไซต์ที่ผู้ใช้จะเห็น ข้อผิดพลาดที่กำหนดเองอาจเป็นประโยชน์ ข้อผิดพลาดที่กำหนดเองจะช่วยให้แน่ใจว่าผู้ใช้จะไม่สับสนเมื่อมีบางอย่างผิดพลาด

คุณต้องการเรียนรู้เพิ่มเติมเกี่ยวกับการเข้ารหัสใน JavaScript หรือไม่? อ่านคู่มือวิธีการเรียนรู้ JavaScript ของเรา คู่มือนี้มีคำแนะนำเบื้องต้นเกี่ยวกับวิธีการเรียนรู้ JavaScript