JavaScript debugging

JavaScript debugging

When writing JavaScript, it can be painful without debugging tools.

JavaScript debugging

It is difficult to write JavaScript programs without debugging tools.

Your code may contain syntax errors, logical errors, which are more difficult to find without debugging tools.

In general, if JavaScript has an error, there is no prompt, so you can't find the location of the code error.

	Typically, you get an error writing a new JavaScript code.

JavaScript debugging tool

Finding errors in program code is called code debugging.

Debugging is difficult, but fortunately, many browsers have built-in debugging tools.

The built-in debugging tool can start or close, and serious error messages are sent to the user.

With the debug tool, we can set break points (where the code stops executing) and detect variables as the code executes.

Browser-enabled debugging tools typically press F12 and select "Console" in the debug menu.

Console .log the () method

If your browser supports debugging, you can .log JavaScript value on the debug window using the console method:

Set a break point

In the debug window, you can set break points for JavaScript code.

At each break point, JavaScript code stops executing so that we can check the value of the JavaScript variable.

After the check is complete, you can re-execute the code, such as the play button.

debugger keyword

The debugger keyword is used to stop JavaScript execution and to call debug functions.

This keyword has the same effect as setting break points in the debugging tool.

The debugger statement will not work if debugging is not available.

Turn on debugger and the code stops executing before the third line.

Debug tools for the main browser

Typically, browser-enabled debugging tools typically press F12 and select "Console" in the debug menu.

The steps for each browser are as follows:

Chrome

• Open your browser.
• Select the tool in the menu.
• Select the developer tool in the tool.
• Finally, select Console.

Firefox browser

• Open your browser.
• Visit the page:
  http://www.getfirebug.com。
• Follow the instructions:
  Install Firebug.

Internet Explorer browser.

• Open your browser.
• Select the tool in the menu.
• Select the developer tool in the tool.
• Finally, select Console.

Opera

• Open your browser.
• Opera's built-in debugging tool is Dragonfly, which details accessible pages:
  http://www.opera.com/dragonfly/。

Safari

• Open your browser.
• Visit the page:
  http://extentions.apple.com。
• Follow the instructions:
  install Firebug Lite。

Extended reading

Firebug tutorial: Debug JavaScript with Firebug