Day 39 Debugging Techniques
Debugging ek developer ka sabse important skill hai. Bugs hamesha aate hain — important yeh hai ke unhe quickly dhundna aur fix karna. Chrome DevTools aur smart console use se debugging bohot asaan hoti hai.
Console Methods
console.log se zyada powerful methods hain.
// Different log levels
console.log("Normal info");
console.warn("⚠️ Warning message");
console.error("❌ Error occurred");
console.info("ℹ️ Information");
// Table format
console.table([
{ name: "Ali", age: 25 },
{ name: "Sara", age: 30 }
]);
// Grouping
console.group("User Details");
console.log("Name: Zohaib");
console.log("City: Lahore");
console.groupEnd();
// Timing
console.time("myOperation");
// ... some code ...
console.timeEnd("myOperation"); // shows ms taken
// Conditional
console.assert(2 + 2 === 5, "Math is broken!"); // logs error if false
Breakpoints & debugger
Code execution rokne ke tarike.
function calculateTotal(items) {
debugger; // ← execution yahan ruk jaegi!
let total = items.reduce((sum, item) => {
console.log(`Processing: ${item.name} = ${item.price}`);
return sum + item.price;
}, 0);
return total;
}
// DevTools mein:
// 1. F12 → Sources tab
// 2. Line number click karo → breakpoint
// 3. F8 = continue, F10 = step over, F11 = step into
🎯 Practice Challenge
Ek buggy function lo jo galat calculation karta ho. Debugging techniques use karke bug dhundho aur fix karo.