console.log, console.error, console.assert and More
Published: 2022-10-15 12:11:01

Most new programmers or even some intermediate programmers stuck with using only console.log that they've learned as the JavaScript 101 lessons but don't use other methods provided in the console object. So in today' blog, I'm going to introduce other less-used console methods that you'll surely be going to be using in your upcoming projects

# console.log
console.log() method accepts any value and outputs that the given value to the console. It's most-used method for debugging purposes. I'd say that you'r going to use it in 80% of the time. If value that you pass is error-free, then opt this method.
```js
const fullName = "Jaxongir Rahimov"
console.log(fullName) // Jaxongir Rahimov is output to the console
```

# console.clear
console.clear() method does not accept any arguments and only works in the browser console. And it's used to clear the browser console when it's populated with too many statements, objects, functions, and so on. But remember, it does not remove all the code from the browser history, to do that you've to do that manually
```js
const person = {
  name: "Jaxongir",
  country: "Uzbekistan"
}
const isAllowedToDrink = promp("Are you over 18")

// all the above code is cleared from the browser console
console.clear() 

```

# console.error
console.error() accepts any error type and outputs: error type and the message indicating what caused that error. Most people stuck with log method to display even error messages. So next time if you find yourself that you need to display error message than you should this method
```js
const error = new Error("Something went wrong!");
console.error(error);
// Error: Something went wrong!

const error = new SyntaxError("It's wrong syntax!");
console.error(error);
// SyntaxError: It's wrong syntax!
```

# console.warn
console.warn() is an alias of console.error but it's used to display warning message not error messages in the console.
```js
console.warn("Warning! you should'not use innerHTML for setting text")
```

# console.info
console.info is an alias of console.log but it should be used to display informational text to the console
```js
console.info("Modal should be centered")
```

# console.assert
console.assert() is quite similar to console.error but with one difference it requires boolean value as the first argument and the message as the second argument that to be displayed if boolean evaluates to true else not displayed. It's quite handy as it avoids need to wrap console.error in conditional
```js
const balance = 0
console.assert(balance <= 0, "Your balance is empty, you can't withdraw money")
```

# console.count and countReset
console.count() accepts label and displays how many times count() is called with that label if no value is provided label default to default. And console.countReset() resets label count to 0
```js
console.count();
console.count();
console.count();
console.countReset();
console.count();
console.count();
/**
Output:
default: 1
default: 2
default: 3
default: 0
default: 1
default: 2
*/

const label = "label";
console.count(label);
console.count(label);
console.count(label);
/**
Output:
label: 1
label: 2
label: 3
*/
```

# console.group and groupEnd
console.group starts message grouping which means all the console declarations after it will be nested within it and groupEnd ends message grouping and any message outputs with consoles after groupEnd will be outside nested object. Try example below in your console to see it's effect in practise
```js
const label = "label";
console.group();
console.count(label);
console.count(label);
console.count(label);
console.groupEnd();
console.log("Outside group message nesting");

```

### console.table
console.table is very useful when you need to display array of data in tabular format. All you've to do is just pass array and it outputs the result in tabular format in the browser console. Name of the column will be index if values are primitive but if it's object than property names will be column names. Try below example in your browser

```js
const people = [
  { name: "Samantha" },
  { name: "Gabriel" },
  { name: "Saruman" },
  { name: "KSI" },
];

console.table(people);

```

# console.time and timeEnd
console.time() and console.timeEnd() methods are handy when we need to calculate how long does it take to perform certain operation. Both accepts labels and they must have the same label. time() method initiate timer and timeEnd stops the timer and indicates how long it took to complete operations in ms. Try below code in your browser
```js
console.time("Label");
for (let i = 0; i < 10000; i++) {
  console.log(i);
}
console.timeEnd("Label");
```

# console.trace
console.trace() method accepts message and outputs that message with current call-stack or functions order that are called in order based on where trace() method is called
```js
const func1 = () => {
  console.trace("Current Call-Stack Trace:");
};
const func2 = () => {
  func1();
};
const func3 = () => {
  func2();
};
const func4 = () => {
  func3();
};
func4();

```