I'm trying to debug some js in the browser (Chrome specifically). How can I check what value is set for some_data and new_data?

I realized due to variable scope being confined to functions, some_data and new_data don't exist after the document ready() was executed.

$(document).ready(function(){
   var some_data = [4, 8, 15, 16, 23, 42];
       var new_data = some_data * 2;
});

I'm trying to debug some js in the browser (Chrome specifically). How can I check what value is set for some_data and new_data?

I realized due to variable scope being confined to functions, some_data and new_data don't exist after the document ready() was executed.

$(document).ready(function(){
   var some_data = [4, 8, 15, 16, 23, 42];
       var new_data = some_data * 2;
});

• javascript
• jquery
• debugging
• google-chrome
• breakpoints

• console.dir(some_data); console.dir(new_data); – Aaron Blenkush Commented Mar 21, 2013 at 18:22
• 3 Have you tried setting a breakpoint in chrome dev tools at this point. You could also use conosle.log – Mark Meyer Commented Mar 21, 2013 at 18:23
• 2 You tagged the question with the answer. Set a breakpoint in the debugger! – epascarello Commented Mar 21, 2013 at 18:25
• 2 Agree with @NuclearGhost, setting a breakpoint will display the value of variables in the current scope. – victmo Commented Mar 21, 2013 at 18:25
• 1 For some reason I'm not allowed to add an answer but the point the OP is making (which is not covered in the "already answered" link, nor by any of these answers) is that in order to find the code to put a breakpoint in, you must first load the page, which means the document.ready events have already been processed, so it's too late to put a breakpoint. The solution I have found (in chrome at least) is to load the page, make a break point, and then re-load the page. as the scripts are reloaded, the breakpoints you put in last time are re-established, so they will fire again. – Andy Commented Jul 8, 2016 at 15:59

3 Answers 3

Use developer tools. If you're using chrome, hit F12, go to sources, find the file your javascript is in, find your code, set a breakpoint (by clicking to the left of the line you want the breakpoint on), and hit F10 to execute line by line. You can just hover over the variable names and it'll give you the current values.

my two cents ...

write the word debugger inside of the code... and will generate a breakpoints instantly, if you hit (ctrl + i) will show you the debugger controls...

best

You can use developer tool bar in IE, Chrome. For firefox use Firebug, this is a Firefox add-on. For Safari use inspect element. All of most browser support below key:

F10- execute line by line(step over next function call)
F11- (step into next function call)
F8- Pause script execution.