انتقل إلى محتوى الدرس

Rich Console Diagnostic Methods أدوات التشخيص المتقدمة بـ console

أتقن اكتشاف وتصحيح أخطاء JavaScript بمنهجية علمية عبر قراءة مكدس الأخطاء ودوال console.table ونقاط التوقف الشرطية والكلمة debugger والتنقل السطري.
2 صفوف تعليمية
جافا سكريبت
7 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

إلى جانب console.log() المعتادة، يزودك المتصفح بعائلة دوال تشخيصية متخصصة تختصر وقت الفحص بشدة:

الدالة التشخيصيةالميزة العملية في الفحصنصيحة الاستخدام الأفضل
console.log({ qty, price })تطبع اسم كل متغير بجانب قيمته تلقائياًتمنع التباس الأرقام المطبوعة بلا عنوان
console.table(records)تعرض مصفوفات الكائنات في جدول منظممثالية لفحص ردود JSON واكتشاف الحقول الناقصة
console.assert(cond, msg)لا تطبع تحذيراً إلا عند فشل الشرط فقطمراقبة الفرضيات المنطقية بهدوء
console.time / timeEndتقيس الزمن المنقضي بالمللي ثانية بدقةمقارنة سرعة خوارزميتين عملياً
console.trace()تطبع تسلسل الدوال التي أدت للسطر الحاليكشف الجهة التي استدعت دالة بالخطأ
الصف 2 كود برمجي
JavaScript
const items = [{ sku: 'A1', price: '25' }, { sku: 'B2', price: 40 }];
console.table(items);
const badType = typeof items[0].price !== 'number';
console.assert(!badType, 'Price must be a number!');
document.getElementById('dbg-out').textContent =
  'Caught string price bug: ' + JSON.stringify({ firstType: typeof items[0].price });