You can do so much more than console.log(...)! See the
attached link
Show archive.org snapshot
for a great breakdown of what the developer console can give you.
Some of my favorites:
console.log takes many arguments
E.g. console.log("Current string:", string, "Current number:", 12)
Your output can have hyperlinks to Javascript objects Show archive.org snapshot
E.g. console.log("Check out the current %o, it's great", location)
Displaying tabular data Show archive.org snapshot
Just hand an array of arrays (or an array of objects) to console.table().
Example: console.table(["apples", "oranges", "bananas"]) prints:
| (index) | Values |
|---|---|
| 0 | "apples" |
| 1 | "oranges" |
| 2 | "bananas" |
Grouping output in nested, collapsible sections Show archive.org snapshot
Great for debugging deeply nested or recursive function invocations
console.log("group:");
console.group();
console.log("group content");
console.groupEnd();
console.log("back to base level");
Output:
> group:
> group content
> back to base level
Profiling the time a piece of code takes to run Show archive.org snapshot
Great to find bottlenecks
console.time("answer time");
alert("Click to continue");
console.timeEnd("answer time");
Output:
answer time: timer started
answer time: 998ms
Output a current stack trace Show archive.org snapshot
console.trace(): Great when you're debugging and you lost track of where you are in the current call stack.
Posted by Henning Koch to makandra dev (2015-01-09 08:29)