javascriptDebugging and consoleعیب‌یابی و کنسول در جاوااسکریپت
عیب‌یابی جاوااسکریپت را با مشاهدهٔ ورودی و مقدار میانی تمرین کنید؛ کاربرد console.log، محل خطا و breakpoint را در مثال جمع قیمت‌ها بشناسید.
مفهوم به زبان ساده
عیب‌یابی یعنی پیدا کردن علت تفاوت رفتار واقعی برنامه با انتظار مشخص. نخست باید بدانید خروجی مورد انتظار چیست؛ سپس مرحله‌ای را پیدا کنید که مقدار از انتظار دور شده است. کنسول برای دیدن خطا و چاپ مقدارها مفید است. چاپ بیشتر همیشه پاسخ بهتر نیست؛ هر پیام باید یک پرسش معین دربارهٔ جریان داده را جواب بدهد.
در مثال، پیش از افزودن هر قیمت، مجموع فعلی را چاپ می‌کنیم. از روی دو پیام می‌توان دید مقدار صفر چگونه به ۲۰۰۰۰ می‌رسد و نتیجهٔ نهایی چگونه ۵۰۰۰۰ می‌شود. اگر یکی از قیمت‌ها متن باشد، همین مشاهده می‌تواند رفتار چسباندن متن را آشکار کند. این روش جای بررسی نوع و قرارداد ورودی را نمی‌گیرد؛ فقط یافتن مسیر مشکل را آسان می‌کند.
در ابزار توسعهٔ مرورگر، breakpoint امکان توقف روی یک خط و بررسی مقدارها و پشتهٔ فراخوانی را می‌دهد. نخستین محل مرتبط خطا و ورودی را دنبال کنید، نه فقط آخرین پیام را. برخی نمایش‌های کنسول برای شیء، وضعیت بعدی آن را هم هنگام بازکردن نشان می‌دهند؛ برای مقایسهٔ دقیق، مقدارهای ساده یا تصویر متنی مناسب ثبت کنید. رمز، توکن و دادهٔ شخصی واقعی را برای عیب‌یابی بی‌دلیل چاپ نکنید.
کجا به کار می‌آید؟
- ردگیری ورودی، مقدار میانی و نتیجه در یک محاسبه
- پیداکردن اولین مرحلهٔ ناهماهنگ با انتظار نوشته‌شده
از تعریف تا یک مثال واقعی
function total(prices) {
let result = 0;
for (const price of prices) {
console.log('before ' + result);
result += price;
}
return result;
}
console.log('total ' + total([20000, 30000]));
before 0 before 20000 total 50000
این مثال چطور کار می‌کند؟
مجموع با صفر شروع می‌شود و پیام نخست آن را نشان می‌دهد.
پس از افزودن قیمت اول، پیام دور دوم مقدار ۲۰۰۰۰ را نشان می‌دهد.
قیمت دوم افزوده می‌شود و نتیجهٔ نهایی ۵۰۰۰۰ چاپ می‌شود.
اشتباه رایج
پاک‌کردن پیام خطا یا اضافه‌کردن catch خالی، اصلاح علت نیست. همچنین خروجی console.log نتیجهٔ برگردانده‌شدهٔ تابع را جایگزین نمی‌کند.
این را به خاطر بسپارید
قبل از اصلاح، انتظار و ورودی را مشخص کنید؛ سپس اولین محل اختلاف را با مشاهدهٔ هدفمند پیدا کنید.