MDN Blog: JavaScript console methods

Earlier in the year, I wrote about using grep on the MDN Blog for code search under the "developer essential" category. I categorize it this way because I think it will give people unfamiliar with grep a massive productivity boost and exposure to skills like working on the command line and regular expressions. This looks like it's becoming a series of posts on "essentials" (or what I think are incredibly beneficial skills, at least) for working effectively as a web developer.

The next topic I thought would be interesting was JavaScript console methods. People who work extensively with JavaScript might not even be aware that the console has capabilities that could eliminate the need to write custom handling or use third-party libraries. What's better than using built-in functionality that works everywhere to cut out unnecessary code?

In the blog post, I covered some examples of what the console can do and some of the lesser-known methods that you might find helpful or just plain fun:

const dogs = [
  { name: "Yoshi", color: "Black", personality: "Calm" },
  { name: "Melanie", color: "Brown", personality: "Hyperactive" },
  { name: "Peppers", color: "white", personality: "Unpredictable" },
];

console.table(dogs);

Check out the post I wrote for the MDN Blog that describes some fun and exciting console methods. Everyone will find something new to use in projects, whether you're a beginner or an advanced JavaScript developer. Here's what the post covers:

  • 🚨logging levels to indicate severity
  • ⏲ counting events & adding timers for events or tasks
  • 😮 displaying data as tables
  • 📋 grouping logs by topic, task, or event type
  • 🔬 exploring application traces using the console
  • 🧘‍♀️ clearing out the console if logs become noisy or distracting
console.warn("You might not be subscribed to the MDN Blog RSS feed.");

const errorMsg = `Oops, we're on ${document.location} instead!`;
// If the assertion is true, nothing happens
console.assert(document.location == "https://bsmth.de", { errorMsg });
// Assertion failed:
// Object { errorMsg: "Oops, we're on https://bsmth.de/mdn-blog-javascript-regex-reference/ instead" }

If you liked the post, you should also see the JavaScript regular expression updates. Let me know what you think about the MDN blog post and if you use grep for something fun. Leave a comment below or get in touch on Mastodon.

console.info("Happy hacking!") 💻