Useful JS Tips

#50 - Helpful Console Logging Tricks

2016-03-03 by @zackhall

Using conditional breakpoints to log data

If you wanted to log to the console a value each time a function is called, you can use conditional break points to do this. Open up your dev tools, find the function where you’d like to log data to the console and set a breakpoint with the following condition:

console.log(data.value) && false

A conditional breakpoint pauses the page thread only if the condition for the breakpoint evaluates to true. So by using a condition like console.log(‘foo’) && false it’s guaranteed to evaluate to false since you’re putting the literal false in the AND condition. So this will not pause the page thread when it’s hit, but it will log data to the console. This can also be used to count how many times a function or callback is called.

Here’s how you can set a conditional breakpoint in Edge, Chrome, Firefox and Safari.

Printing a function variable to console

Have you ever logged a function variable to the console and weren’t able to just view the function’s code? The quickest way to see the function’s code is to coerce it to a string using concatenation with an empty string.

console.log(funcVariable + '');
<<返回目录