How to Debug Javascript

Method 1 of 2:

Using the Debugger; Statement

Determine if debugger; is the correct tool for this situation. Ask yourself:
1. Do I need to look at this in great detail?
2. Do I want to know the values, and the path the program is taking?
3. Can I effectively test this through the developer window?
Before the problem area, enter the statement: debugger;
Open your browser's developer tools by right clicking and selecting inspect element. This will be browser specific, but they should all work very similarly.
Once inside of developer tools, run your code again. This time it will stop at the debugger; statement.
Step through your program, line-by-line, by pressing F10.
Repeat the process as necessary. You may have to restart your program to trigger the debugger; again.
Once you've used the debugger to solve the problem, be sure to remove the statement when you're done.

Method 2 of 2:

Using an Alert();

Determine if alert(); is the correct tool for this situation. Ask yourself:
1. Do I only need to know if a certain part of the program is running?
2. Do I only want to know one value, and timing is not important?
After the problem area, enter the statement: alert();
1. Note that this alert will print, "This is an alert." To the screen. This could be any value.
Run your code as normal.
1. Once this point is reached, it will create a popup on your screen with whatever information put into the argument of alert();
Use the information from the alert(); to solve the issue.
1. Is alert(); printing what I expect it to?
2. Is alert(); printing at all?
Repeat the process as necessary. You may have to restart your program to trigger the alert(); again.
Be certain to remove the alert(); statement when you're done.

Lesley Montoya

Update 05 March 2020

You should read it

May be interested

How to debug a Windows application with Process Monitor
one way to get around the problem is to use a free official microsoft utility called process monitor. this tool will help you diagnose and debug any windows application errors or problems.
! = and! == What is the difference in JavaScript?
javascript includes operators like in other languages. an operator performs some operations on one or more operands (data values) and produces a result. today's article will help readers learn about 2! = and! == operators in javascript.
Learn about ES6 in Javascript
es6 refers to version 6 of the ecma script programming language. ecma script is the standard name for javascript and version 6 is the next version after version 5, released in 2011.
Activate Disk Utility's Debug menu
os x's disk utility has a hidden debug menu. when enabled, this menu can give you access to more disk utility features than you normally see.
Summary of JavaScript exercises with sample code
in order to make your javascript learning easier, tipsmake.com has compiled a number of javascript exercises with sample solutions for you to practice.
JavaScript location in HTML File
there is flexibility in providing javascript code anywhere in an html document. however, the most preferred ways to include javascript in an html file.
How to Turn on JavaScript
javascript is a language used in many websites to provide additional functionality and access to the user. developers use javascript to deliver a large part of their site's functionality to you, the user. your browser must have javascript...
What is the difference between Java and JavaScript?
although the names of java and javascript seem to be related (javascript seems to be a script in java?), but that's the only similarity. these two languages are not technically related to each other.
Void keywords in JavaScript
void is an important keyword in javascript that can be used as a unary operator before its single operand, which can be in any type. this operator defines an expression to be evaluated without returning a value.
JavaScript code to generate error charts & graphs
the example below illustrates a sample variance chart created with javascript that incorporates a column chart. you will also get the source code for reference and editing as you wish.

How to Debug Javascript

Using the Debugger; Statement

Using an Alert();

You should read it

May be interested

JavaScript