Debug Javascript Code | Javascript Hindi Course For Beginners ( 2023 ) #13

 

What is Bug ?

A bug is a flaw or defect in a program's code that causes it to behave unexpectedly or produce incorrect results. Bugs can be caused by a variety of factors, such as coding mistakes, hardware failures, or external factors like changes to the system environment.
 

What is Error ?

An error, on the other hand, is a mistake made by a programmer that results in incorrect code. Errors can be caused by a variety of factors, such as incorrect assumptions, poor understanding of the programming language, or simple typing mistakes.
 
By Following ways we can debug our Javascript Code
  1. By using console.log() 
// How to Use console logs for debugging
// Identify the section of the code that is not working
//  as expected or causing errors.
// Identify the variables or values that you want to debug.
// Insert console.log() statements in your code at key points 
// where you want to track the behavior of your code.
// Run your code and monitor the output of the console.log()
// statements in the browser or console.

function multiply(a, b) {
  console.log("Multiplying", a, "and", b);
  let result = a * b;
  console.log("Result is", result);
  return result;
}

let x = 5;
let y = 3;
let z = multiply(x, y);
console.log("Final result is", z);
  1. By using debugger keyword ( Using Chrome Devtools )
// Use Chrome Devtools

const priceValue = prompt("Enter the price of the item");
const FIXED_DELIVERY_FEE = 50;
function calculateTotalPrice(price, fixedDeliveryFee) {
  return price + fixedDeliveryFee;
}
debugger; // this will open this code inside chrome devtools
const total = calculateTotalPrice(priceValue, 10);

alert("The total price is $" + total);
  1. By using vs code for debugging code
How to start debugger
Click on Run And Debug
notion image
Select Debugger Type
notion image
Port Should be same as your running application port → In my case 5500 for live server
notion image