The developer console can do more than you think!

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:

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.