← #45 Get the current timestamp
#46

Log an array to the Console

Topics: JavaScript

Instead of using the console.log function, console.table produces a better output. It works pretty well with an array or object.

const resources = [
{
name: '1 LOC',
description: 'Favorite JavaScript utilities in single line of code',
link: 'https://1loc.dev'
},
{
name: 'CSS Layout',
description: 'A collection of popular layouts and patterns made with CSS',
link: 'https://csslayout.io',
},
{
name: 'HTML DOM',
description: 'How to manage HTML DOM with vanilla JavaScript',
link: 'https://htmldom.dev',
},
{
name: 'Responsive Design Patterns',
description: 'A collection of patterns to create a responsive web page',
link: 'https://responsive.page',
},
{
name: 'Front-end Tips',
description: 'Super tiny, quick tips, tricks and best practices of front-end development',
link: 'https://getfrontend.tips',
},
{
name: 'this VS that',
description: 'The differences between ___ and ___ in the front-end development',
link: 'https://thisthat.dev',
},
];

console.table(resources);

Here is the screenshot compares the output of two methods above:

console.table

If you don't want to see all the columns, then you can indicate the columns explicitly:

// Show `name` and `link` properties 
console.table(resources, ['name', 'link']);

console.table

This tip also has effect when you want to pick some particular properties from a JSON representation.

More

Fix a typo or suggest an improvement
#47 Format a list