How to use Firebug's debugger functions?

Question

I don't have an experience with any debugger in any language, but I recently found some videos showing Firebug.

I'm now playing with Firebug with a script I included an error with.

What I understand now is:

• I can set a breakpoint, which is shown as a red circle.
• Firebug stops at the breakpoint and gives me 4 options (Continue, Step Into, Step Over and Step Out).

What I don't understand are:

• What is the difference between the 4 options (i.e., Continue, Step Into, Step Over and Step Out)? To me, Step Over is sometimes similar to Step Into... I could be wrong here.

I would be grateful if you could explain the differences of the 4 options.

Answer 1

• Continue - Resume execution as if the code was never stopped

• Step Into - Change the debugger context to run into the function the code is stopped on. If the code cannot step into the function, this is the same as Step Over

• Step Over - Execute the code the debugger is stopped on, but stay within the current function

• Step Out - Execute code until the end of the current function, and resume debugging once it has returned

These terms apply to all debuggers. Here is perhaps a better (or at least, more complete) explanation: http://www.developerfusion.com/article/33/debugging/4/

Answer 2

var foo = "bar"; 
var spam = "eggs";
debugger; // calling debugger with stop point
alert(foo + " " + spam);