JavaScript Essentials For Dummies

Chapter 9

Debugging JavaScript

IN THIS CHAPTER

Debugging errors using the Console

Setting breakpoints

Stepping through JavaScript code

JavaScript and modern web browsers offer a ton of top-notch debugging tools that can remove some of the burden of program problem solving. In this chapter, you delve into these tools to explore how they can help you find and fix most programming errors. You also investigate a number of tips and techniques that can go a long way in helping you avoid coding errors in the first place.

Laying Out Your Debugging Tools

All the major web browsers come with a sophisticated set of debugging tools that can make your life as a web developer much easier and much saner. Most web developers debug their scripts using Google Chrome, so I focus on that browser in this chapter. But in this section, I give you an overview of the tools that are available in all the major browsers and how to get at them.

Here’s how you open the web development tools in Chrome, Firefox, Microsoft Edge, and Safari:

• Chrome for Windows: Click Customize and Control Google Chrome (the three vertical dots to the right of the address bar) and then select More Tools ⇒ Developer Tools. Shortcut: ...