How to debug JavaScript File ?
Last Updated :
30 Jan, 2022
Debugging is essential because there are many errors that are not giving any kind of messages so to find out that we debug the code and find out the missing point.
Example 1: Using console.log() Method
In this, we can find out the error by consoling the code in various places. Using a console is one of the easy-to-use ways of debugging code in JavaScript. In our browser, the console is a command-line interface that helps in executing the snippets of code. So we can use this function to print our data and see what exactly went wrong.
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible"
content="IE=edge" />
<meta name="description" content="" />
<meta name="viewport" content=
"width=device-width, initial-scale=1" />
<link rel="stylesheet" href="" />
</head>
<body>
<script src="./index.js" async defer></script>
</body>
</html>
Filename: index.js
JavaScript
var a;
console.log(a)
a = 20;
console.log(a)
a = "Geeks For Geeks";
console.log(a)
Output: Here we can see that the first console.log gives undefined because we just define the var a but does not assign any value. We can open the console by pressing the F12 key or by clicking the right button and then selecting inspect.
Example 2: Debugger Keyword
Javascript provides the keyword Debugger to debug the code. When we add the debugger keyword in between our code, so after executing the code, a debugger panel will show up where we can make breakpoints and play/pause to check the value and understand according to it. With the help of this debugger panel, we can see step by step execution of a program.
JavaScript
var a;
console.log(a)
debugger
a = 20;
console.log(a)
a = "Hello World";
console.log(a)
Output: After writing the debugger keyword, when we run the code then in the console this kind of debugger panel will show up where we make breakpoints and play/pause to check the value and understand according to it. We can open the console by pressing the F12 key or by clicking the right button and then selecting inspect.
Breakpoints are the place where code stops running, by this if we are ever stuck in the infinite loop then we can trace it by this.
Similar Reads
How to Execute JavaScript Code ? Javascript is a high-level, Just In Time compiled programming language which converts the entire machine code at once and then executes it immediately. Javascript code is executed by the Javascript Engine, which is separate software. Different browsers have their own implementation of JS Engine embe
2 min read
Debugging in JavaScript Debugging is the process of testing, finding, and reducing bugs (errors) in computer programs. It involves:Identifying errors (syntax, runtime, or logical errors).Using debugging tools to analyze code execution.Implementing fixes and verifying correctness.Types of Errors in JavaScriptSyntax Errors:
4 min read
Introduction to JavaScript JavaScript is a versatile, dynamically typed programming language used for interactive web applications, supporting both client-side and server-side development, and integrating seamlessly with HTML, CSS, and a rich standard library.JavaScript is a single-threaded language that executes one task at
7 min read
How to enable JavaScript in my browser ? We will explore the process of enabling JavaScript in web browsers to ensure seamless functionality of applications and websites. JavaScript serves as a fundamental component of modern web development, facilitating dynamic interactions and enhanced user experiences. However, encountering issues wher
2 min read
JavaScript Hello World The JavaScript Hello World program is a simple tradition used by programmers to learn the new syntax of a programming language. It involves displaying the text "Hello, World!" on the screen. This basic exercise helps you understand how to output text and run simple scripts in a new programming envir
2 min read
How to debug code in ES6 ? In this article, we are going to learn how to debug a code in ES6. Debugging is the process of finding and resolving the problem or mistake in code due to which it doesn't work as expected. Debugging is an important part of programming that helps programmers to fix the bugs in the code. Checking an
2 min read