Stop using console.log() instead use👇

Console.log is a part of the Console API. This API allows developers to write messages to the console, which can be used for debugging purposes.

The log() method writes (logs) a message to the console which is useful for testing purposes.

Console.log() is a great tool for debugging, but it should not be used as a permanent solution in production code. Instead, you should use the following:

1. Console.table()

You can use Console.table() to display data in an organized manner. Console.table() displays data in a tabular format, allowing you to quickly view the structure of a complex data set.

Console.table() can be used to easily view the contents of objects, arrays, and other data structures. Furthermore, it can be used to debug asynchronous code, as it displays the data in the same order that the code is written.

In addition, it is more efficient than console.log(), as it does not require you to manually iterate over the data in order to log it. This makes it much faster and easier to inspect your data.

Example:

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const me = new Person("Tyrone", "Jones");

console.table(me);

2. Console.time()

You should use console.time() to measure the performance of your code. It's used to measure the amount of time it takes for a certain block of code to execute.

Using console.time() is simple. You call it before the code you want to measure, and then call console.timeEnd() after the code has executed. It will then output the time it took for the code to execute in milliseconds.

For example, if you want to measure the time it takes for a certain function to run, you could use console.time() like this:

console.time('functionTimer');
funcToMeasure();
console.timeEnd('functionTimer');

3. Console.dir()

Console.dir() is a method of the console object that provides a better way to inspect objects. Instead of simply outputting the object as a string like Console.log(), Console.dir() displays the object's structure in a tree format, making it easier to inspect and understand the object's contents. Additionally, it allows you to inspect the object's prototype chain in the same tree format, making it easier to debug prototype-related issues.

4. Console.trace()

Console.trace() is a method of the console object that provides a better way to inspect objects and trace errors. Instead of simply outputting the object as a string like Console.log(), Console.trace() displays a stack trace of the current code execution, making it easier to identify where an issue originated. Console.trace() also includes the context of the variables in the trace, allowing you to quickly inspect the values of objects at the time of the trace.

Example:

function foo() {
  function bar() {
    console.trace();
  }
  bar();
}

foo();

Output:

bar
foo
<anonymous>

5. Console.assert()

The console.assert() method writes an error message to the console if the assertion is false. If the assertion is true, nothing happens.
Any boolean expression can be the assertion. If the assertion is false, the message is written to the console.

Example:

const errorMsg = "the # is not even";
for (let number = 2; number <= 5; number++) {
  console.log(`the # is ${number}`);
  console.assert(number % 2 === 0, '%o', { number, errorMsg });
}

Output:

the # is 2
the # is 3
Assertion failed: {number: 3, errorMsg: "the # is not even"}
the # is 4
the # is 5
Assertion failed: {number: 5, errorMsg: "the # is not even"}

If you found this useful, consider:

✅ Follow @iarchitsharma for more content like this
✅ Follow me on Twitter where I share free resources on regular basis!