But last week, while debugging a function that wasn’t behaving, I had about fifteen console.logs stacked on top of each other, and I realized I had no idea which log was which anymore. My console looked like a chaotic grocery list, and I was drowning in my own debugging attempts.

That’s when a classmate showed me a few console methods I didn’t even know existed. Mind. Blown. These aren’t advanced tricks or complex debugging tools — just three simple console methods that make life so much easier when you’re trying to figure out what your code is actually doing.

1. console.table() — Because Arrays Deserve Better Than This: [object Object]

The Problem: You know that moment when you console.log() an array of objects and get something like this mess?

const users = [
  { name: "Sarah", age: 24, role: "student" },
  { name: "Mike", age: 22, role: "student" },
  { name: "Jenny", age: 26, role: "TA" }
];

console.log(users);
// You get a collapsed array you have to click through...

You end up clicking those little arrows to expand each object, scrolling up and down, trying to compare values. It’s tedious.

The Solution: Enter console.table(). Just swap out that log:

console.table(users);

And suddenly, you get an actual table in your console. Like, a real table with columns for name, age, and role. Each row is numbered with the array index. You can see everything at once, compare values instantly, and actually understand your data structure without the mental gymnastics.

This changed how I debug API responses. When I fetch a list of users or products, I can immediately see if any data is missing or formatted wrong. No more clicking through nested objects like I’m playing a game of developer whack-a-mole.

2. console.group() — Organizing the Chaos

The Problem: Remember those fifteen console.logs I mentioned? Here’s what my console looked like:

checking user...
user object:
starting validation
email format
email valid: true
checking password
password length
password valid: true
calling API
API response

Which logs belong together? Who knows! It’s just a wall of text, and good luck figuring out which “checking” goes with which validation when you’ve got multiple function calls happening.

The Solution: console.group() and console.groupEnd() create collapsible sections:

function validateUser(user) {
  console.group('User Validation');
  
  console.log('User:', user.name);
  console.log('Email valid:', validateEmail(user.email));
  console.log('Password valid:', validatePassword(user.password));
  
  console.groupEnd();
}

Now your console shows a nice collapsible “User Validation” section. All related logs are nested inside it. You can collapse sections you don’t care about and focus on the ones you do. It’s like giving your debugging output a proper folder structure.

I started using this for any function that does multiple steps, and it’s made my debugging sessions way less frustrating. When something breaks, I can immediately see which section of my code is the problem.

3. console.time() / console.timeEnd() — The Simple Speedometer

The Problem: I wrote a function that filters and sorts an array. It works, but it feels… slow? Is it actually slow? How slow is slow? I had no idea.

The Solution: Wrap your code in timing markers:

console.time('filterUsers');

const activeUsers = users
  .filter(user => user.active)
  .sort((a, b) => a.name.localeCompare(b.name));

console.timeEnd('filterUsers');
// Output: filterUsers: 0.847ms

The console tells you exactly how long that operation took. The labels need to match (whatever you pass to time() needs to match timeEnd()), and boom—instant performance measurement.

This is perfect for beginner-level optimization questions. Is my loop approach faster than this filter chain? Should I be worried about this nested loop? Just time both versions and compare. No fancy profiling tools needed, just a quick reality check on whether that function you’re worried about is actually the bottleneck (spoiler: it usually isn’t).

Try These Today

Here’s the thing about these methods — they don’t make you a better programmer overnight, but they do make debugging way less painful. And when debugging is less painful, you can focus more on actually learning JavaScript instead of getting frustrated with your own logs.

Next time you reach for console.log(), ask yourself: would console.table() make this clearer? Should I group these logs? Do I want to know how fast this runs? Start building these into your debugging habits now, and future-you will thank present-you.

Your turn: What console methods have you discovered that made you wonder how you ever lived without them? Drop your favorites in the responses — I’m always looking for more tricks to add to my toolkit.

Currently learning JavaScript one console method at a time. If you found this helpful, give it a clap and follow for more “things I just learned” posts.