Java Reference
In-Depth Information
You can also add your own variables to watch, inspecting their values as you step through code. To add
a watch, simply click “New watch expression... ,” type the variable name you want to watch, and press
the Enter key. Watches that you add have a gray background, and moving your mouse over them reveals
a red Delete button.
You can watch any variable you want. If the variable is in scope, the variable's value is displayed. If the
variable is out of scope, a ReferenceError is displayed as its value.
Although this information is helpful when you want to see what exactly is going on in your code, it's
not very helpful if you can't control code execution. It's impractical to set a breakpoint and reload the
page multiple times just to advance to the next line, so we use a process called stepping.
Stepping Through Code
Code stepping is controlled by four buttons in the upper-right of the window, next to the source code
search box (see Figure 4-7).
Continue
Step
Into
Step Over
Step
Out
Figure 4-7
❑
Continue
(shortcut key is F8): Its function is to continue code execution until either the next
breakpoint or the end of all code is reached.
❑
Step Into
(shortcut key is F11): Executes the current line of code and moves to the next state-
ment. If the current line is a function, then it steps to the fi rst line of the function.
Step Over
❑
(F10): Like Step Into, this executes the current line of code and moves to the next state-
ment. However, if the statement is a function, it executes the function and steps to the next line
after the function call.
❑
Step Out
: Returns to the calling function.
Let's do some stepping; follow these steps:
1.
Step Into the code by clicking the icon or pressing F11. The debugger executes the currently
highlighted line of code and moves to the next line.
2.
Look in the Watch tab and at the value of
writeString
; it is
“1 * 2 = 2”
. As you can see, the
values displayed in the Watch tab are updated in real time.
3.
One nice feature of Firebug is the page updates, if necessary, as you step through code. Click
Step Into two more times to see this in action. Figure 4-8 shows the page updated while step-
ping through code.
