How to debug code within Jquery closure?

I'm trying to become a better javascript developer by making use of established design patterns,开发者_StackOverflow中文版 avoiding polluting the global namespace, etc. While it's taking me some time to get used to the different style of coding, there are lots of good resources.

Where I'm really lagging is in my development practices. I'm used to being able to open Firebug / IE or Chrome console and invoking line by line tests and method calls. This doesn't seem possible with all design patterns (intentionally, I suppose).

How do serious JS developers debug code within closures, etc?

ie:

$(function() {
  ...
  [declare lots of vars, functions, page load actions, etc.]
  ...
}

Do I really have to insert debug/break statements all over the place and then make sure they get wrapped/cleaned up before deployment?

---

var closure = (function(){function foo{...} return {'bar':foo}}());

now you can call something like closure.bar() ... and see what the result is

so long as you return an object that allows you to access the closure functions and vars you can test away...

sometimes I will write my inital code without closure

and make it all work... then wrap it in a namespace so I dont have to worry about it... but that is another approach

it really depends on your code style and how you develop

test early test often

best of luck