به نام خدا با عرض سلام و احترام خدمت شما دوستان عزیز. در ادامه آموزش جاوا اسکریت این جلسه قصد داریم به مبحث Error Handling در جاوا اسکریپت بپردازیم.با ما همراه باشید.

Handling Errors

گاهی اوقات کد جاوا اسکریپت شما آنطوری که انتظار می رود اجرا نمی شود و در نتیجه با خطا مواجه می شوید.دلایل متعددی وجود دارد که ممکن است باعث ایجاد خطا شود، به عنوان مثال:

مشکل در اتصال شبکه
ممکن است کاربر مقدار نامعتبری را در فیلد فرم وارد کرده باشد.
ارجاع به اشیا یا توابعی که وجود ندارند.
ارسال یا دریافت داده های نادرست از وب سرور.
سرویسی که برنامه باید به آن دسترسی داشته باشد ممکن است موقتاً در دسترس نباشد.

این نوع خطاها به عنوان خطاهای زمان اجرا شناخته می شوند، زیرا در زمان اجرای اسکریپت رخ می دهند.یک برنامه کاربردی حرفه ای باید توانایی رسیدگی به چنین خطاهای زمان اجرا را داشته باشد.معمولاً به این معنی است که کاربر را در مورد مشکل به طور واضح و دقت بیشتری آگاه نمایید.

The try…catch Statement

برای Error Handling در جاوا اسکریپت ، این زبان دستور try-catch را برای به دام انداختن خطاهای زمان اجرا و رسیدگی به آنها را به خوبی ارائه می کند.

هر کدی که احتمالاً خطا ایجاد کند باید در بلوک try دستور قرار داده شود و کدی که برای رسیدگی به خطا وجود دارد در بلوک catch قرار می گیرد، همانطور که در زیر نشان داده شده است:

try {
    // Code that may cause an error
} catch(error) {
    // Action to be performed when an error occurs
}

try {

// Code that may cause an error

} catch(error) {

// Action to be performed when an error occurs

}

اگر خطایی در هر نقطه از بلوک tryرخ دهد، اجرای کد بلافاصله از بلوک tryبه بلوک catch منتقل می شود.اگر خطایی در بلوک try رخ ندهد، بلوک catch نادیده گرفته می‌شود و برنامه پس از دستور try-catch به اجرای خود ادامه می‌دهد.

مثال زیر نشان می دهد که دستور try-catch چگونه عمل می کند:

try {
    var greet = "Hi, there!";
    document.write(greet);
    
    // Trying to access a non-existent variable
    document.write(welcome);
    
    // If error occurred following line won't execute
    alert("All statements are executed successfully.");
} catch(error) {
    // Handle the error
  alert("Caught error: " + error.message);
}
 
// Continue execution
document.write("<p>Hello World!</p>");

try {

var greet = "Hi, there!";

document.write(greet);

// Trying to access a non-existent variable

document.write(welcome);

// If error occurred following line won't execute

alert("All statements are executed successfully.");

} catch(error) {

// Handle the error

alert("Caught error: " + error.message);

}

// Continue execution

document.write("<p>Hello World!</p>");

اسکریپت بالا به جای چاپ آن در کنسول مرورگر، خطایی ایجاد می کند که در الرت باکس نمایش داده می شود. که باتوجه به آن، برنامه به طور ناگهانی متوقف نشد، حتی با وجود یک خطا.

همچنین توجه داشته باشید که کلمه کلیدی catch با یک شناسه در پرانتز دنبال می شود.این شناسه مانند یک پارامتر تابع عمل می کند.هنگامی که یک خطا رخ می دهد، مفسر جاوا اسکریپت یک شی تولید می کند که حاوی جزئیات مربوط به آن است.سپس این شی خطا به عنوان آرگومان برای مدیریت به catch ارسال می شود.

نکته: دستور try-catch مکانیزم رسیدگی به استثنا است. یک استثنا سیگنالی است که نشان می دهد نوعی شرایط استثنایی یا خطا در حین اجرای یک برنامه رخ داده است. اصطلاحات”exception” و “error” اغلب به جای یکدیگر استفاده می شوند.

The try…catch…finally Statement

دستور try-catchمی تواند یک بند finally نیز داشته باشد.کد داخل بلوک finally همیشه اجرا می شود، صرف نظر از اینکه خطایی در بلوک tryرخ داده است یا خیر.

مثال زیر همیشه کل زمان صرف شده برای تکمیل اجرای کد را نمایش می دهد.

// Assigning the value returned by the prompt dialog box to a variable
var num = prompt("Enter a positive integer between 0 to 100");

// Storing the time when execution start
var start = Date.now();

try {
    if(num > 0 && num <= 100) {
        alert(Math.pow(num, num)); // the base to the exponent power
    } else {
        throw new Error("An invalid value is entered!");
    }
} catch(e) {
    alert(e.message);
} finally {
    // Displaying the time taken to execute the code
    alert("Execution took: " + (Date.now() - start) + "ms");
}

// Assigning the value returned by the prompt dialog box to a variable

var num = prompt("Enter a positive integer between 0 to 100");

// Storing the time when execution start

var start = Date.now();

try {

if(num > 0 && num <= 100) {

alert(Math.pow(num, num)); // the base to the exponent power

} else {

throw new Error("An invalid value is entered!");

}

} catch(e) {

alert(e.message);

} finally {

// Displaying the time taken to execute the code

alert("Execution took: " + (Date.now() - start) + "ms");

}

Throwing Errors

تاکنون خطاهایی را دیده‌ایم که به‌طور خودکار توسط پارسر جاوا اسکریپت هنگام بروز خطا ایجاد می‌شوند.با این حال، امکان تنظیم خطا به صورت دستی با استفاده از عبارت throw نیز وجود دارد.

شکل کلی (یا نحو) عبارت throw به این صورت است: ;throw expression

expression می تواند یک شی یا یک مقدار از هر نوع داده باشد.با این حال، بهتر است از اشیاء، ترجیحا با مشخصاتname و message استفاده کنید.سازنده ()Error داخلی جاوا اسکریپت راه مناسبی برای ایجاد یک شی خطا فراهم می کند.به عنوان مثال:

throw 123;
throw "Missing values!";
throw true;
throw { name: "InvalidParameter", message: "Parameter is not a number!" };
throw new Error("Something went wrong!");

throw 123;

throw "Missing values!";

throw true;

throw { name: "InvalidParameter", message: "Parameter is not a number!" };

throw new Error("Something went wrong!");

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript throw Statement</title>
</head>
<body>
    <script>
    var num = prompt("Please enter an integer value");
    
    try {
        if(num == "" || num == null || !Number.isInteger(+num)) {
            throw new Error("Invalid value!");
        } else {
            document.write("Correct value!");
        }
    } catch(e) {
        document.write(e.message);
    }
    </script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript throw Statement</title>

</head>

<body>

var num = prompt("Please enter an integer value");

try {

if(num == "" || num == null || !Number.isInteger(+num)) {

throw new Error("Invalid value!");

} else {

document.write("Correct value!");

}

} catch(e) {

document.write(e.message);

}

</script>

</body>

</html>

توجه: اگر از توابع سازنده خطای داخلی جاوا اسکریپت (به عنوان مثال ()Error(), TypeError, …) برای ایجاد اشیاء خطا استفاده می کنید، ویژگی name همان نام سازنده است و پیام برابر با آرگومان ارسال شده به تابع سازنده می باشد.

حالا یک تابع ()squareRoot ایجاد می کنیم تا جذر یک عدد را پیدا کنیم.این کار را می توان به سادگی با استفاده از تابع داخلی جاوا اسکریپت ()Math.sqrt انجام داد، اما مشکل اینجاست که NaN را برای اعداد منفی برمی گرداند، بدون اینکه هیچ اشاره ای در مورد اشتباه پیش آمده ارائه دهد.

اگر عدد منفی ارائه شد، می‌خواهیم این مشکل را با ایجاد یک خطای سفارشی برطرف کنیم.

function squareRoot(number) {
    // Throw error if number is negative
    if(number < 0) {
        throw new Error("Sorry, can't calculate square root of a negative number.");
    } else {
        return Math.sqrt(number);
    }
}
    
try {
    squareRoot(16);
    squareRoot(625);
    squareRoot(-9);
    squareRoot(100);
    
    // If error is thrown following line won't execute
    alert("All calculations are performed successfully.");
} catch(e) {
    // Handle the error
    alert(e.message);
}

function squareRoot(number) {

// Throw error if number is negative

if(number < 0) {

throw new Error("Sorry, can't calculate square root of a negative number.");

} else {

return Math.sqrt(number);

}

try {

squareRoot(16);

squareRoot(625);

squareRoot(-9);

squareRoot(100);

// If error is thrown following line won't execute

alert("All calculations are performed successfully.");

} catch(e) {

// Handle the error

alert(e.message);

}

Error Types

شی Error پایه همه خطاها است و دارای دو ویژگی اصلی است – یک ویژگی name که نوع خطا را مشخص می کند و یک ویژگی messageکه حاوی پیامی است که خطا را با جزئیات بیشتر توصیف می کند. هر خطای پرتاب شده نمونه ای از شی Error خواهد بود.

چندین نوع خطا وجود دارد که می تواند در طول اجرای یک برنامه جاوا اسکریپت رخ دهد، مانندRangeError, ReferenceError, SyntaxError, TypeError, وURIError.

بخش زیر هر یک از این نوع خطاها را با جزئیات بیشتری توضیح می دهد:

RangeError

زمانی که از عددی خارج از محدوده مقدار مجاز استفاده می کنید، یک RangeErrorاجرا می شود.به عنوان مثال، ایجاد یک آرایه با طول منفی باعث ایجاد RangeError می شود.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript RangeError</title>
</head>
<body>
<script>
var num = 12.735;

try { 
num.toFixed(200); // throws a range error (allowable range from 0 to 100)
} catch(e) {
document.write(e.name + ": " + e.message);
}
</script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript RangeError</title>

</head>

<body>

var num = 12.735;

try {

num.toFixed(200); // throws a range error (allowable range from 0 to 100)

} catch(e) {

document.write(e.name + ": " + e.message);

}

</script>

</body>

</html>

ReferenceError

ReferenceError معمولاً زمانی ایجاد می شود که شما سعی می کنید به متغیر یا شی ای که وجود ندارد ارجاع دهید یا به آن دسترسی پیدا کنید. مثال زیر نشان می دهد که ReferenceError چگونه رخ می دهد.

var firstName = "Harry";
console.log(firstname); // throws a reference error (variable names are case-sensitive)

undefinedObj.getValues(); // throws a reference error

nonexistentArray.length; // throws a reference

var firstName = "Harry";

console.log(firstname); // throws a reference error (variable names are case-sensitive)

undefinedObj.getValues(); // throws a reference error

nonexistentArray.length; // throws a reference

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript ReferenceError</title>
</head>
<body>
    <script>
    var firstName = "Harry";
    
    try {        
        document.write(firstname); // throws a reference error (variable names are case-sensitive)
    } catch(e) {
        document.write(e.name + ": " +  e.message);
    }
    </script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript ReferenceError</title>

</head>

<body>

var firstName = "Harry";

try {

document.write(firstname); // throws a reference error (variable names are case-sensitive)

} catch(e) {

document.write(e.name + ": " + e.message);

}

</script>

</body>

</html>

SyntaxError

اگر مشکلی در نحو در کد جاوا اسکریپت شما وجود داشته باشد، در زمان اجرا، یک SyntaxError داده می‌شود. به عنوان مثال، اگر براکت بسته وجود نداشته باشد، حلقه ها ساختار درستی نخواهند داشت.

var array = ["a", "b", "c"];
document.write(array.slice(2); // throws a syntax error (missing bracket)

alert("Hello World!'); // throws a syntax error (quote mismatch)

var array = ["a", "b", "c"];

document.write(array.slice(2); // throws a syntax error (missing bracket)

alert("Hello World!'); // throws a syntax error (quote mismatch)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript SyntaxError</title>
</head>
<body>
    <script>
    try {        
        eval("alert('Hello World!)"); // throws a syntax error (missing bracket)               
    } catch(e) {
        document.write(e.name + ": " +  e.message);
    }
    </script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript SyntaxError</title>

</head>

<body>

try {

eval("alert('Hello World!)"); // throws a syntax error (missing bracket)

} catch(e) {

document.write(e.name + ": " + e.message);

}

</script>

</body>

</html>

TypeError

زمانی که مقداری از نوع مورد انتظار نباشد، TypeErrorلانچ می شود. به عنوان مثال، فراخوانی یک متد رشته بر روی عدد، فراخوانی روش آرایه روی رشته و ….

var num = 123;
num.toLowerCase(); /* throws a type error (since toLowerCase() is a string method, a number can't be converted to lowercase) */

var greet = "Hello World!"
greet.join() // throws a type error (since join() is an array method)

var num = 123;

num.toLowerCase(); /* throws a type error (since toLowerCase() is a string method, a number can't be converted to lowercase) */

var greet = "Hello World!"

greet.join() // throws a type error (since join() is an array method)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript TypeError</title>
</head>
<body>
    <script>
    var num = 123;

    try {        
        num.toLowerCase(); /* throws a type error (since toLowerCase() is a string method, a number can't be converted to lowercase) */             
    } catch(e) {
        document.write(e.name + ": " +  e.message);
    }
    </script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript TypeError</title>

</head>

<body>

var num = 123;

try {

num.toLowerCase(); /* throws a type error (since toLowerCase() is a string method, a number can't be converted to lowercase) */

} catch(e) {

document.write(e.name + ": " + e.message);

}

</script>

</body>

</html>

URIError

هنگامی که یک URI نامعتبر (مخفف Uniform Resource Identifier) را برای توابع مرتبط با URI مانند ()encodeURI یا ()decodeURI, مشخص کنید، همانطور که در اینجا نشان داده شده است، URIError ایجاد می شود:

var a = "%E6%A2%B";
decodeURI(a);  // throws a URI error

var b = "\uD800";
encodeURI(b);   // throws a URI error

var a = "%E6%A2%B";

decodeURI(a); // throws a URI error

var b = "\uD800";

encodeURI(b); // throws a URI error

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript URIError</title>
</head>
<body>
    <script>
    var a = "%E6%A2%B";

    try {        
        decodeURI(a);  // throws a URI error          
    } catch(e) {
        document.write(e.name + ": " +  e.message);
    }
    </script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>JavaScript URIError</title>

</head>

<body>

var a = "%E6%A2%B";

try {

decodeURI(a); // throws a URI error

} catch(e) {

document.write(e.name + ": " + e.message);

}

</script>

</body>

</html>

خب دوستان گرامی به پایان جلسه Error Handling در جاوا اسکریپت رسیدیم امیدواریم مورد توجه شما قرار گیرد.

سایر مقالات:

JSON Parsing در جاوا اسکریپت

Strict Mode در جاوا اسکریپت

برای امتیاز به این نوشته کلیک کنید!

[کل: 1 میانگین: 5]

اشتراک‌گذاری

JSON Parsing در جاوا اسکریپت نوشته قبل

پیاده سازی کتابخانه data binding در اندروید به چه صورتی می‌باشد ؟ نوشته بعد

علی فرجی

علی فرجی هستم، برنامه نویس جاوا اسکریپت و ریکت با بیش از 5 سال تجربه. من عاشق برنامه نویسیم و همیشه به دنبال یادگیری چیزهای جدید هستم.همچنین یکی از بنیانگذار های سایت کدایت ، یک سایت آموزش برنامه نویسی در حوزه جاوا اسکریپت، ریکت، اندروید و ... هستم. امیدوارم بتوانم با دانش و تجربه خود به سایر برنامه نویسان کمک کنم تا در این زمینه پیشرفت کنند.