DEV Community

0xkoji
0xkoji

Posted on

21 8

12 Console.xxx You May Not Know

I think many of us are using console.log regularly but there is more console.

console.table

const foo = { id: 1, verified: true, color: 'green' };
const bar = { id: 2, verified: false, color: 'red' };
console.table({ foo, bar})
Enter fullscreen mode Exit fullscreen mode

console.group

console.group('User Details');
console.log('name: John Doe');
console.log('job: Software Developer');
// Nested Group
console.group('Address');
console.log('Street: 123 Townsend Street');
console.log('City: San Francisco');
console.log('State: CA');
console.groupEnd();
console.groupEnd();
Enter fullscreen mode Exit fullscreen mode

console.warn

console.warn("warning") 
Enter fullscreen mode Exit fullscreen mode

console.error

console.error("error")
Enter fullscreen mode Exit fullscreen mode

console.info

console.info("info")
Enter fullscreen mode Exit fullscreen mode

color tag

console.log('%c Auth ', 
            'color: white; background-color: #2274A5', 
            'Login page rendered');
console.log('%c GraphQL ', 
            'color: white; background-color: #95B46A', 
            'Get user details');
console.log('%c Error ', 
            'color: white; background-color: #D33F49', 
            'Error getting user details');
Enter fullscreen mode Exit fullscreen mode

console.time

let i = 0;
console.time("While loop");
while (i < 1000000) {
  i++;
}
console.timeEnd("While loop");
console.time("For loop");
for (i = 0; i < 1000000; i++) {
  // For Loop
}
console.timeEnd("For loop");
Enter fullscreen mode Exit fullscreen mode

Others

console.trace

console.assert

console.debug

console.profile

console.dir

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (5)

Collapse
 
jonathanrufino profile image
Jonathan Rufino

Interesting list, some of them I didn't know.

You could add images to show the result.

Collapse
 
glpzzz profile image
Gabriel Alejandro López López

Amazing!!

Collapse
 
adnaveen profile image
Naveen Raj

Nice & useful list!

Collapse
 
thewasif profile image
Muhammad Wasif

Wow.... That seems very useful. Thank you for awesome knowledge.

Collapse
 
armshare profile image
armshare

Wow Koji ,
Thank you for new knowledge

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay