Kesalahan JavaScript - Throw dan Try to Catch

try Perintah membolehkan anda uji kesalahan dalam blok kod.

catch Perintah membolehkan anda mengatasi kesalahan.

throw Perintah ini memungkinkan Anda membuat kesalahan kustom.

finally Membuatkan anda dapat melaksanakan kod, di sebelah try dan catch, tanpa mengira hasilnya.

Kesalahan akan terjadi sentiasa!

Banyak kesalahan yang akan terjadi semasa pelaksanaan kod JavaScript.

Kesalahan boleh disebabkan oleh kesalahan pencodek programer, kesalahan masukan yang salah, atau masalah yang tak diperkirakan lain.

实例

Dalam contoh ini, kami melalui alert Menulis kod peringatan untuk membuat kesalahan sengaja:

<p id="demo"></p>
<script>
try {
    alert("Selamat datang!");
{}
catch(err) {
    document.getElementById("demo").innerHTML = err.message;
{}
</script>

亲自试一试

JavaScript menangkap alert sebagai kesalahan dan menjalankan kod untuk mengatasi kesalahan.

JavaScript try dan catch

try Perintah membolehkan anda menetapkan blok kod untuk mendeteksi kesalahan semasa pelaksanaan.

catch Perintah membolehkan anda menetapkan blok kod untuk dijalankan, jika terjadi kesalahan dalam blok kod try.

Perintah JavaScript try dan catch Muncul bersama-sama:

try {
     Blok kod untuk pengujian
{}
 catch(err) {
     Blok kod untuk pengendalian kesalahan
{}

JavaScript menghantar kesalahan

Ketika terjadi kesalahan, JavaScript biasanya akan berhenti dan memunculkan pesan kesalahan.

Terminologi ini digambarkan seperti ini:JavaScript akan dilempar kesalahan (lempar kesalahan)。

JavaScript sebenarnya akan membuat kesalahan dengan dua properti: Objek Error:name dan pesan。

Perintah throw

throw Perintah ini memungkinkan Anda membuat kesalahan kustom.

Tekniknya Anda dapatDilempar kesalahan (lempar kesalahan)。

Kesalahan dapat berupa string, angka, boolean, atau objek JavaScript:

throw "Terlalu Besar";    // dilempar teks
throw 500;          // dilempar angka

jika throw dengan try dan catch Dapat digunakan bersama-sama untuk mengendalikan alir program dan menghasilkan pesan kesalahan kustom.

Kasus Pengesahan Input

Contoh ini akan memeriksa input. Jika nilai salah, akan dilempar kesalahan (err).

Kesalahan ini (err) ditangkap oleh perintah catch dan menampilkan pesan kesalahan kustom:

<!DOCTYPE html>
<html>
<body>
<p>Masukkan angka antara 5 dan 10:</p>
<input id="demo" type="text">
<button type="button" onclick="fungsiSaya()">Uji Input</button>
<p id="message"></p>
<script>
function fungsiSaya() {
    var mesej, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "") throw "kosong";
         if(isNaN(x)) throw "bukan angka";
         x = Number(x);
        if(x < 5) throw "terlalu kecil";
        if(x > 10) throw "terlalu besar";
    {}
    catch(err) {
        mesej.innerHTML = "Input adalah " + err;
    {}
{}
</script>
</body>
</html>

亲自试一试

Pengesahan HTML

Kode di atas hanya contoh.

Browser modern biasanya akan menggabungkan JavaScript dengan pengesahan HTML yang disediakan, melalui penggunaan aturan pengesahan yang ditetapkan di properti HTML:

<input id="demo" type="number" min="5" max="10" step="1">

Anda akan belajar lebih banyak tentang pengesahan formulir di bab yang akan datang di tutorial ini.

Perintah finally

finally Perintah ini memungkinkan Anda untuk melaksanakan kode setelah try dan catch, tanpa mengambil keterangan hasil:

try {
     // Kod blok untuk pengujian
{}
 catch(err) {
     // Kod blok untuk menangani kesalahan
{} 
finally {
     // Kod blok yang dieksekusi terus-menerus tanpa mengambil keterangan hasil
{}

实例

function fungsiSaya() {
    var mesej, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "") throw "kosong";
        if(isNaN(x)) throw "bukan angka";
         x = Number(x);
        if(x >  10) throw "terlalu besar";
        if(x <  5) throw "terlalu kecil";
    {}
    catch(err) {
        message.innerHTML = "kesalahan: " + err + ".";
    {}
    finally {
        document.getElementById("demo").value = "";
    {}
{}

亲自试一试

Objek Error

JavaScript memiliki objek error yang berfungsi untuk menyediakan informasi kesalahan saat terjadi kesalahan.

objek error menyediakan dua property yang berguna:name dan pesan。

property objek Error

property deskripsi
name atur atau kembalikan nama kesalahan
pesan atur atau kembalikan pesan kesalahan (string satu baris)

Nilai Nama Kesalahan Error

property name dari error dapat mengembalikan enam nilai yang berbeda:

nama kesalahan deskripsi
EvalError kesalahan yang terjadi di dalam fungsi eval()
RangeError kesalahan bilangan yang melebihi rentang terjadi
ReferenceError pengambilan yang ilegal terjadi
SyntaxError kesalahan sintaks terjadi
TypeError kesalahan jenis terjadi
URIError kesalahan yang terjadi di dalam encodeURI()

di bawah ini kami jelaskan enam nilai yang berbeda.

kesalahan Eval

EvalError petunjuk kesalahan dalam fungsi eval()

Versi JavaScript yang baru tidak akan melempar apa pun EvalError。Sila gunakan SyntaxError gantikan.

kesalahan rentang

RangeError akan dilempar jika anda menggunakan angka di luar rentang nilai yang sah.

contoh: Anda tidak dapat menetapkan jumlah digit efektif angka menjadi 500.

实例

var num = 1;
try {
    num.toPrecision(500);   // Bilangan tidak dapat memiliki 500 digit efektif
 {}
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
{}

亲自试一试

kesalahan pengambilan

Jika anda menggunakan (mengambil) variabel yang belum dideklarasikan, maka ReferenceError akan dilempar:

实例

var x;
try {
    x = y + 1;   // y tidak dapat diambil (digunakan)
 {}
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
{}

亲自试一试

kesalahan sintaks

Jika anda menghitung kode dengan kesalahan sintaks, maka SyntaxError 被抛出：

实例

try {
    eval("alert('Hello)");   // Kurang ' akan menyebabkan kesalahan
{}
catch(err) {
     document.getElementById("demo").innerHTML = err.name;
{}

亲自试一试

kesalahan jenis

Jika nilai yang anda gunakan bukan dalam rentang nilai yang diharapkan, maka TypeError 被抛出：

实例

var num = 1;
try {
    num.toUpperCase();   // 您无法将数字转换为大写
 {}
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
{}

亲自试一试

URI 错误

假如您在 URI 函数中使用非法字符，则 URIError 被抛出：

实例

try {
    decodeURI("%%%");   // 您无法对这些百分号进行 URI 编码
 {}
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
{}

亲自试一试

非标准的 Error 对象属性

Mozilla 和 Microsoft 定义了非标准的 error 对象属性：

  • fileName (Mozilla)
  • lineNumber (Mozilla)
  • columnNumber (Mozilla)
  • stack (Mozilla)
  • description (Microsoft)
  • number (Microsoft)

请勿在公共网站使用这些属性。它们并不会在所有浏览器中工作。