Skip to main content Accessibility Feedback

Debugging with console tables

This week I learned a super handy debugging trick: console.table().

Debugging often involves logging a bunch of stuff in the console until you find the thing that’s not working the way you’d expect. If you’re logging multiple things at once, keeping track of what’s what can get confusing.

And here’s where console.table() comes into play. Pass in an array of objects, and it creates a table in the console from it (hat tip to Umar Hansa for this one).

Open up the console tab in developer tools and drop this in:

console.table([
	{
		name: "sandwich",
		type: "turkey"
    },
	{
		name: "snack",
		type: "chips"
    },
	{
		name: "drink",
		type: "soda"
    },
]);

Awesome, right?