3 min readAug 24, 2021

Debugging is the skill that all developers should have in their toolbox.

Console.log() is a very powerful, quick and useful method for debugging in JavaScript. Every developers use this method to debug code in everyday life. There’s nothing wrong with this.

But today I’m going to share a tip that makes you debug JavaScript code more efficiently.

console.table()

So, what is console.table()

console.table() allows to print arrays and objects in tabular form in the console. Tabular format works like a charm because you will get greater insight into your data. Thus, makes you debug your code just faster. You can also sort columns quickly.

Syntax :

console.table(data,columns); 
//or
console.table(data);

• data:- The data to fill the table with. It must be either an array or an object.
• columns:- array containing the names of the columns to be included in the table.

How to implement console.table()

console.table() can be implemented in the following ways:

a. Array :

If the value of data argument is an array, then the index column willl be incremented by one, ith the starting value being 0.

var fruits=["apple","mango","grapes"];
console.table(fruits);

Output :

To sort the column, click on the header of that column.

b. Array of arrays

When we print an array of arrays then the column names will be incremented in the same way as the index column values.

var teams=[["John","Jari"],["Claus","Andrew"],["Marti","Martha"]];
console.table(teams);

Output :

C. Object

If the data argument is an object, then index column represents keyand value columns represents the value corresponding to that particular key.

var user={
     name:"Rajvi",
     age:20,
     gender:"female",
}
console.table(user);

Output :

d. Array of Objects

If the value of the data argument is an array of objects then their properties are enumerated in the row, one per column.

var users = [
    {
        name: "john",
        age: 22
    },
    {
        name: "bella",
        age: 25
    },
    {
        name: "Shinchan",
        age: 30
    }
];
console.table(users);

Output :

e. Nested Objects

If the value of data argument is nested objects which means objects whose properties are themselves objects, then console.table() method labels index appropriately with the nested object properties.

var employees = {
    leader: {
        firstname: "Rajvi",
        lastname: "Sudo",
        email: "Rajvi@gmail.com"
    },
    manager: {
        firstname: "Vihan",
        lastname: "Bhatt",
        email: "Vihan@gmail.com"
    },
    developer: {
        firstname: "Smith",
        lastname: "reddy",
        email: "Smith@gmail.com"
    }
}
console.table(employees);

Output :

What if you have an Object that has 10+ properties

If you’ve very large object, this table can become very large and data can be difficult to read. But thankfully, console.table provides an optional second argument that will specify the columns we want and only print those out.

var employees = {
    leader: {
        id:"10001",
        firstname: "Andrew",
        lastname: "Story",
        email: "andrew@gmail.com"
    },
    manager: {        
        id:"10002",
        firstname: "Amit",
        lastname: "Bhatt",
        email: "amit@gmail.com"
    },
    developer: {
        id:"10003",
        firstname: "Param",
        lastname: "Dutta",
        email: "param@gmail.com"
    }
}
console.table(employees,["id","firstname"]);