Inspect Scope During a Breakpoint
In Chrome, when your Javascript execution is paused during a breakpoint, you can interact with and inspect all variables and objects in the current scope, either by hovering over to inspect or by using the console.
Firebug has the same option, but requires selecting "show closures" in the DOM menu.
This powerful feature enables you to easily inspect variables inside closures if you set your breakpoint appropriately.
Firebug has the additional feature of not having to be stopped at a breakpoint to access hidden closure variables. Take this example code:
function Person(name)
{
this.introduce = function()
{
console.log("Hello, my name is %s", name);
}
}
// create an instance of Person:
var someone = new Person("Arthur");
// we call a closure!
someone.introduce(); // prints "Hello, my name is Arthur"
The syntax to access the closure variables is as follow: closure.%variable. In the above example, you would access name using this expression: someone.introduce.%name // ==> "Arthur". Note that you can also change values:
someone.introduce.%name = "Trillian";
someone.introduce(); // prints "Hello, my name is Trillian"
The same syntax works everywhere in Firebug where JavaScript is required, such as in the Watch Panel and conditional breakpoints.