• Choose a category
• All
• Classic-Fiction

By Root 1621 0

often cause a more sinister kind of problem, called a logic error. Logic errors happen when your code doesn’t have any syntax problems, but it’s still not doing what you want. These errors can be much harder to pin down, because you don’t get as much information.

Of course, if you have the right tools, you can eventually track down even the trickiest bugs. The secret is to see exactly what’s going on inside your variables — stuff the user usually doesn’t see.

Logging to the console with Firebug

Firebug has another nifty trick. It allows you to send quick messages to the Firebug console. Take a look at log.html:

This code is special because it contains several references to the console object. This object is available only to Firefox browsers with the FireBug extension installed. When you run the program with Firebug and look at the console tab, you see something similar to Figure 3-10.

The console object allows you to write special messages that only the programmer in the console sees. This ability is a great way to test your code and see what’s going on, especially if things aren’t working the way you want.

If you want to test your code in IE, there’s a version of Firebug (called Firebug Lite) that works on other browsers. Check the Firebug page (https://addons.mozilla.org/en-US/firefox/addon/1843) to download and install this tool if you want to use console commands on non-Firefox browsers.

Figure 3-10: The Firebug console shows lots of new information.

Looking at console output

Here’s how the console object works:

♦ The first loop prints the value of i to the console. Each time through the first loop, the console.log function prints the current value of i. This information is useful whenever the loop isn’t working correctly. You can use the console.log() method to print the value of any variable.

♦ The second loop demonstrates a more elaborate kind of printing. Sometimes, you want to make clear exactly what value you’re sending to the console. Firebug supports a special syntax called formatted printing to simplify this process.

console.log(“i is now %d.”, i);

The text string “i is now %d” indicates what you want written in the console. The special character %d specifies that you place a numeric variable in this position. After the comma, you can indicate the variable you want inserted into the text.

You can use other formatting characters as well. %s is for string, and %o is for object. If you’re familiar with printf in C, you’ll recognize this technique.

♦ You can specify more urgent kinds of logging. If you want, you can use alternatives to the console.log to impart more urgency in your messages. If you compare the code in log.html with the output of Figure 3-10, you can see how info, warning, and error are formatted.

When your program isn’t working properly, try using console commands to describe exactly what’s going on with each of your variables. This approach often helps you see problems and correct them.

When your program works properly, don’t forget to take out the console commands! Either remove them or render them ineffective with comment characters. The console commands will cause an error in any browser that doesn’t have Firebug installed. Typically, your users will not have this extension. (Nor should they need it! You’ve debugged everything for them!)

Using the Interactive Debug Mode

Traditional programming languages often feature a special debugging tool for fixing especially troubling problems. A typical debugger has

♦ The ability to pause a program while it’s running. Logic errors are hard to catch because the program keeps