في هذا الدرس 6تصفّح المواضيع
حتى أدق البرامج قد تصادف ظروفاً طارئة أثناء التشغيل: كقيمة مفقودة أو مدخل غير صالح أو محاولة استدعاء دالة نصية على قيمة undefined. عند وقوع خطأ غير معالج وقت التشغيل، يوقف المحرك تنفيذ السكربت فوراً فتتجمد بقية المهام!
مَيّز بين خطأ الصياغة SyntaxError الذي يُكتشف قبل بدء التشغيل، وأخطاء وقت التشغيل مثل ReferenceError وTypeError وRangeError التي يمكننا احتواؤها بذكاء.
أحط التعليمات المحتمل تعثرها بكتلة try { ... } متبوعةً مباشرةً بكتلة catch (err) { ... }:
- إذا نجحت جميع أسطر
tryدون مشكلات، يتجاهل المحرك كتلةcatchتماماً. - أما إذا تعثر أي سطر داخل
tryفينتقل التنفيذ فوراً إلىcatch (err)لمعالجة الموقف بهدوء واستمرار عمل الصفحة بسلام!
عند انتقال الخطأ إلى catch (err) يمرر المحرك كائناً منظماً يحمل خاصيتين قياسيتين: err.name (نوع الخطأ مثل "TypeError") وerr.message (الوصف النصي للسبب):
| نوع الخطأ القياسي | متى يقع؟ | مثال مسبب |
|---|---|---|
ReferenceError | محاولة قراءة اسم متغير غير معرف أصلاً | console.log(missingVar) |
TypeError | تنفيذ عملية على نوع بيانات لا يقبلها | const x = null; x.trim() |
RangeError | تمرير رقم يتجاوز النطاق المسموح به | (12.5).toFixed(500) |
const rawCoupon = null;
let statusLine = '';
try {
statusLine = rawCoupon.toUpperCase();
} catch (err) {
statusLine = `Recovered from ${err.name} — using default code`;
}
document.getElementById('err-out').textContent = statusLine;إضافة كتلة finally { ... } في النهاية تضمن تشغيل خطوات التنظيف الختامية—كإخفاء مؤشر التحميل أو إعادة تفعيل زر الإرسال—في جميع الأحوال حتماً، سواء اكتملت كتلة try بنجاح أم وقع خطأ التقطته catch.
أحياناً تكون القيمة مقبولة نحوياً في اللغة (مثل عمر سالب -5 أو مبلغ سحب 0) لكنها مرفوضة في منطق تطبيقك! حينئذ نستخدم التعليمة throw new Error("سبب واضح") لإطلاق استثناء مخصص ينقل التنفيذ فوراً إلى كتلة catch.
أطلق دائماً كائناً حقيقياً عبر new Error(...) وتجنب رمي نص مجرد مثل throw "bad" حتى تظل خاصيتا err.name وerr.message متوفرتين بانتظام.
const transferUsd = -25;
let uiBanner = '';
let isBusy = true;
try {
if (transferUsd <= 0) throw new RangeError('Amount must exceed 0');
uiBanner = `Sent ${transferUsd} USD`;
} catch (err) {
uiBanner = `Validation failed: ${err.message}`;
} finally {
isBusy = false;
}
document.getElementById('th-out').textContent = `${uiBanner} | Busy: ${isBusy}`;يرسخ الأمن السيبراني الحديث قاعدة ذهبية تفصل بين ما يراه المستخدم وما يفحصه المطور: اعرض للزائر دائماً رسالة ودية مهذبة ومختصرة عبر textContent ترشده لما يفعل، وإياك وطباعة تتبع المكدس التفصيلي err.stack أو أسماء الملفات والمسارات الداخلية في الواجهة العامة!
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
أتقنت في هذا الدرس تصنيف أخطاء وقت التشغيل، واحتواء الاستثناءات بكتلتي try وcatch، وفحص err.name وerr.message، وضمان التنظيف الختامي عبر finally، وإطلاق أخطاء التحقق عبر throw new Error() مع حماية خصوصية النظام. الخطوة التالية: انطلق الآن إلى الفصل السابع (الحلقات التكرارية) لأتمتة معالجة القوائم والعدادات ببضعة أسطر!
سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.
المصطلحات4
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 try...catch...finally بنية احتواء الأخطاء try/catch/finally
- بنية تحمي البرنامج بتجربة الكود في try والتقاط الخطأ في catch وتنفيذ التنظيف الدائم في finally.
- للمراجعة
- 02 throw Statement تعليمة إطلاق الاستثناء throw
- تعليمة تطلق كائن خطأ مخصص عند رصد حالة غير صالحة وتنقل التنفيذ فوراً إلى كتلة catch.
- للمراجعة
- 03 TypeError & ReferenceError خطآ النوع والمرجع القياسيان
- أشهر أخطاء وقت التشغيل الناتجة عن عملية غير صالحة للنوع أو قراءة متغير غير معرف.
- للمراجعة
- 04 Information Disclosure تسريب تفاصيل النظام بالرسائل
- ممارسة غير آمنة تتمثل في إظهار مسارات الملفات وتفاصيل المكدس التقنية للزائر العام.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
الاختصارات2
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 OWASP OWASP
- Open Worldwide Application Security Project
- المنظمة العالمية لأمن تطبيقات الويب التي توصي بإخفاء التفاصيل الداخلية من رسائل الخطأ العامة.
- للمراجعة
- 02 UX UX
- User Experience
- تجربة المستخدم التي نحافظ على سلاستها باحتواء الأعطال وتقديم رسائل واضحة بدلاً من تجميد الصفحة.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
مهامك قبل الاختبار
خطوة صغيرة كل مرة. وإنجاز تقدر ترجع له.
-
افتح مثال التحقق من التحويل المالي وغيّر قيمة transferUsd من -25 إلى 150 وتأكد أن finally ما زالت تضبط isBusy على false.
-
قارن بين التبويب الأول والثاني في المحاكي لملاحظة متى يتم تخطي catch ومتى تلتقط الخطأ.
تأشير المهمة إقرار منك بإتمامها، وليس تصحيحًا آليًا للكود. يُحفظ تقدمك في حسابك.
اختبر فهمك.
ووصلها للإتقان.
كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.
أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.
الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.