Console.table a property of the Chrome Javascript Debugging console that you probably didn't knew existed

Console.table displays in the console a table with information of an object or and array. The first column in the table will be labeled (index). If the data is an array, then its values will be the array indices. If the data is an object, then its values will be the property names, then all the properties will be rendered respectively.

Console.table work best (needless to say) for tabular data. If all the objects and arrays have an irregular structure, you'll end up with most of the cells containing empty values and only a couple of properties will be listed. This feature gives you a better overview of your data in most situations.

Arrays

var films = [
  {name:"Batman vs Superman",value:"20$"},
  {name:"Ted 2",value:"15$"},
  {name:"500 Days of summer",value:"5$"},
  {name:"Batman : The Dark Knight",value:"20$"}
];

console.table(films);

Your console should output :

Nice isn't?

Objects

var mostViewedFilmsInWorldWideCinemas = {
  china: {name:"Batman vs Superman",revenues:"225M$"},
  usa: {name:"Batman vs Superman",revenues:"220M$"},
  brazil:{name:"Batman vs Superman",revenues:80000000},
  colombia:{name:"Batman vs Superman",revenues:"92M$"},
  spain:{name:"Batman vs Superman",revenues: undefined},
  disneyLand:{name:"Bambi"},
};

console.table(mostViewedFilmsInWorldWideCinemas);

Your console output should look like:

Excluding data from be displayed

To exclude a particular field from an object, the console.table method expects an array as second parameter with the names of the property that should be displayed:

var mostViewedFilmsInWorldWideCinemas = {
  china: {name:"Batman vs Superman",revenues:"225M$"},
  usa: {name:"Batman vs Superman",revenues:"220M$"},
  brazil:{name:"Batman vs Superman",revenues:80000000},
  colombia:{name:"Batman vs Superman",revenues:"92M$"},
  spain:{name:"Batman vs Superman",revenues: undefined},
  disneyLand:{name:"Bambi"},
};

// Show me only the names
console.table(mostViewedFilmsInWorldWideCinemas,["name"]);

The output should look like :

You can sort the table by a particular column by clicking on that column's label. You will not suddenly using console.table to log all that you want, the data needs to be very explicit and accomplish an organized structure, but don't fear to make a mess with this function in your console , go ahead , test it !