JavaScript - Penanganan Kesalahan & Pengecualian
Ada tiga jenis kesalahan dalam pemrograman: (a) Kesalahan Sintaks, (b) Kesalahan Runtime, dan (c) Kesalahan Logis.
Kesalahan Sintaks
Kesalahan sintaks, juga disebut parsing errors, terjadi pada waktu kompilasi dalam bahasa pemrograman tradisional dan pada waktu interpretasi dalam JavaScript.
Misalnya, baris berikut ini menyebabkan kesalahan sintaks karena tidak ada tanda kurung penutup.
<script type = "text/javascript">
<!--
window.print(;
//-->
</script>
Saat kesalahan sintaks terjadi di JavaScript, hanya kode yang ada di dalam utas yang sama dengan kesalahan sintaksis yang terpengaruh dan kode lainnya di utas lain dijalankan dengan asumsi tidak ada di dalamnya yang bergantung pada kode yang berisi kesalahan.
Kesalahan Waktu Proses
Kesalahan waktu proses, juga disebut exceptions, terjadi selama eksekusi (setelah kompilasi / interpretasi).
Misalnya, baris berikut menyebabkan kesalahan waktu proses karena di sini sintaksnya benar, tetapi saat waktu proses, baris mencoba memanggil metode yang tidak ada.
<script type = "text/javascript">
<!--
window.printme();
//-->
</script>
Pengecualian juga memengaruhi rangkaian tempat munculnya, yang memungkinkan rangkaian JavaScript lain melanjutkan eksekusi normal.
Kesalahan Logis
Kesalahan logika bisa menjadi jenis kesalahan yang paling sulit untuk dilacak. Kesalahan ini bukan hasil dari kesalahan sintaks atau runtime. Sebaliknya, ini terjadi ketika Anda membuat kesalahan dalam logika yang menjalankan skrip Anda dan Anda tidak mendapatkan hasil yang diharapkan.
Anda tidak dapat menangkap kesalahan tersebut, karena itu tergantung pada kebutuhan bisnis Anda jenis logika apa yang ingin Anda masukkan ke dalam program Anda.
Mencoba ... menangkap ... akhirnya Pernyataan
Versi terbaru JavaScript menambahkan kemampuan penanganan pengecualian. JavaScript mengimplementasikantry...catch...finally membangun serta throw operator untuk menangani pengecualian.
Kamu bisa catch yang dihasilkan programmer dan runtime pengecualian, tetapi Anda tidak bisa catch Kesalahan sintaksis JavaScript.
Ini dia try...catch...finally blok sintaks -
<script type = "text/javascript">
<!--
try {
// Code to run
[break;]
}
catch ( e ) {
// Code to run if an exception occurs
[break;]
}
[ finally {
// Code that is always executed regardless of
// an exception occurring
}]
//-->
</script>
Itu try blok harus diikuti oleh salah satunya catch blok atau satu finallyblok (atau salah satu dari keduanya). Ketika pengecualian terjadi ditry blok, pengecualian ditempatkan di e dan catchblok dijalankan. Opsionalfinally blok dijalankan tanpa syarat setelah coba / tangkap.
Contoh
Berikut adalah contoh di mana kami mencoba memanggil fungsi yang tidak ada yang pada gilirannya memunculkan pengecualian. Mari kita lihat bagaimana perilakunya tanpatry...catch-
<html>
<head>
<script type = "text/javascript">
<!--
function myFunc() {
var a = 100;
alert("Value of variable a is : " + a );
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Sekarang mari kita coba menangkap pengecualian ini menggunakan try...catchdan menampilkan pesan yang ramah pengguna. Anda juga dapat menyembunyikan pesan ini, jika Anda ingin menyembunyikan kesalahan ini dari pengguna.
<html>
<head>
<script type = "text/javascript">
<!--
function myFunc() {
var a = 100;
try {
alert("Value of variable a is : " + a );
}
catch ( e ) {
alert("Error: " + e.description );
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Kamu dapat memakai finallyblok yang akan selalu dieksekusi tanpa syarat setelah coba / tangkap. Berikut ini contohnya.
<html>
<head>
<script type = "text/javascript">
<!--
function myFunc() {
var a = 100;
try {
alert("Value of variable a is : " + a );
}
catch ( e ) {
alert("Error: " + e.description );
}
finally {
alert("Finally block will always execute!" );
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Pernyataan lemparan
Kamu dapat memakai throwpernyataan untuk meningkatkan pengecualian bawaan atau pengecualian Anda yang disesuaikan. Nanti pengecualian ini dapat ditangkap dan Anda dapat mengambil tindakan yang sesuai.
Contoh
Contoh berikut menunjukkan cara menggunakan file throw pernyataan.
<html>
<head>
<script type = "text/javascript">
<!--
function myFunc() {
var a = 100;
var b = 0;
try {
if ( b == 0 ) {
throw( "Divide by zero error." );
} else {
var c = a / b;
}
}
catch ( e ) {
alert("Error: " + e );
}
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Anda dapat memunculkan pengecualian dalam satu fungsi menggunakan string, integer, Boolean, atau objek dan kemudian Anda dapat menangkap pengecualian itu baik dalam fungsi yang sama seperti yang kita lakukan di atas, atau di fungsi lain menggunakan try...catch blok.
Metode onerror ()
Itu onerrorevent handler adalah fitur pertama yang memfasilitasi penanganan error di JavaScript. Ituerror acara diaktifkan pada objek jendela setiap kali terjadi pengecualian pada halaman.
<html>
<head>
<script type = "text/javascript">
<!--
window.onerror = function () {
alert("An error occurred.");
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Itu onerror event handler menyediakan tiga bagian informasi untuk mengidentifikasi sifat sebenarnya dari kesalahan -
Error message - Pesan yang sama yang akan ditampilkan browser untuk kesalahan yang diberikan
URL - File tempat kesalahan terjadi
Line number- Nomor baris di URL yang diberikan yang menyebabkan kesalahan
Berikut adalah contoh untuk menunjukkan cara mengekstrak informasi ini.
Contoh
<html>
<head>
<script type = "text/javascript">
<!--
window.onerror = function (msg, url, line) {
alert("Message : " + msg );
alert("url : " + url );
alert("Line number : " + line );
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type = "button" value = "Click Me" onclick = "myFunc();" />
</form>
</body>
</html>
Keluaran
Anda dapat menampilkan informasi yang diekstrak dengan cara apa pun yang menurut Anda lebih baik.
Anda bisa menggunakan onerror metode, seperti yang ditunjukkan di bawah ini, untuk menampilkan pesan kesalahan jika ada masalah dalam memuat gambar.
<img src="myimage.gif" onerror="alert('An error occurred loading the image.')" />
Kamu dapat memakai onerror dengan banyak tag HTML untuk menampilkan pesan yang sesuai jika terjadi kesalahan.