Different Types of Console Methods

Different Types of Console Methods

ยท

5 min read

Hey Folks๐Ÿ™‹๐Ÿปโ€โ™‚, In this article, I will take you through different console methods available in JavaScript. We might all be very familiar with console.log(). But it is not the only method out there. We will try to understand different console methods in JavaScript.

What is a Console?

The console is the tool which is used to test and check the working of the code is proper or not by printing the results.

Remember a console is an object that can access methods like log(), warn() etc using the dot (.) operator.

Syntax:

console.method(parameters)

Let's Discuss different types of console methods now...

  • log()

When you first started learning JS, console.log() was the first thing you learnt to display the message on the output screen.

Syntax:

console.log(parameter)

Example:

// Console.log() Method 
console.log('Hashnode') 
console.log(3+4) 
console.log(true) 
console.log([1,2,3,4])

Output:

  • info()

    console.info() the method is very similar log() method but usually, it is used to display important information in the console.

    Syntax:

      // console.info() method
      console.info('This is information');
    
      console.info({firstName : 'abc', lastName : 'xyz'});
    
      console.info([1,2,3,4,5]);
    

    Output:

  • clear()

    As the name says this method is used to clear the messages in the console.

    Syntax:

      console.clear()
    

    This method doesn't have any parameters.

    Example:

      // console.clear() method
      console.clear()
    

    Output:

  • warn()

    This method is used to display warning messages in the console.

    Syntax:

      console.warn(parameter)
    

    In the previous version of JS, only strings can be used as parameters but in the most recent versions, all types of data can be used.

    Example:

      // console.warn(parameter) method 
      console.warn("This is a warning")
    

    Output:

    The warning message will be highlighted in yellow colour.

  • error()

    This method is used to display the errors which are found in the code. It is used to debug the code.

    Syntax:

      console.error(parameter)
    

    In the previous version of JS, only strings can be used as parameters but in the most recent versions, all types of data can be used.

    Example:

      console.error('This is a Error')
    

    Output:

    The Error message will be highlighted in red colour.

  • assert()

    This method writes an error message to the console if the expression is false. If the expression is true, nothing happens.

    Syntax:

      console.assert(expression,message)
    

    This method is used to print error messages based on conditions. The expression will be evaluated and if the expression is false then an error will be thrown.

    Example:

      console.assert(3%2==0 ,"Not an even number")
      // No Error message because expression is true
      console.assert(2%2==0 ,"even number")
    

    Output:

  • debug()

    This method outputs a message to the web console at the "debug" log level. The message will only be visible to the user if the console is configured to display debug output.

    Syntax:

      console.debug(parameter)
    

    Debug log level should be configured in the console UI. This might correspond to debug or verbose log level.

    Example:

      // debug() method
      console.debug("This is debugging")
    

    Output:

  • trace()

    This method tracks the execution of the code from starting point to the endpoint and how the code ended at a certain point.

    Syntax:

      console.trace(parameters)
    

    Parameters can be one or more objects to be displayed along with a trace but they are optional.

    Example:

       function track() {
        function secondtrack() {
          console.trace();
        }
        secondtrack();
      }
    
      track();
    

    Output:

  • table()

    This method is used to display data in tabular form. It takes objects or arrays as parameters.

    Syntax:

      console.table(data)
             or
      console.table(data,data_columns)
    

    Example:

      // table() method
      console.table(["Apple","Mango","Orange"],'fruits')
      console.table({firstname:'peter',lastname:'steve'})
    

    Output:

  • Count Methods

    1. count()

      This method counts the number of times it is called in the program.

      Syntax:

       console.count(label)
      

      Parameters which is passed in the method are a type of label which is a string. If the parameters are not present in the method then the default parameters will be added.

      Example:

       // console.count() method
      
       for(let i=0;i<3;i++){
           console.count("Number")
         }
      

      Output:

    2. countReset()

      This method resets the counter of the count() method

      Syntax:

       console.countReset(label)
      

      Example:

       // console.countReset() method
       console.count()
       console.count()
       console.count()
       console.countReset()
       console.count()
      

      Output:

  • Grouping Methods

    1. group()

      This method allows you to group the console messages. This method creates the group.

      Syntax:

       console.group(label)
      

      The Parameter label is the special type of string given to name the group and it's optional.

    2. groupEnd()

      This method is used to end the group.

      Syntax:

       console.groupEnd()
      

      No parameter is provided for this method.

      Example:

       // console.group() and console.groupEnd() methods
       console.group("Programming Languages")
       console.log("C")
       console.log("C++")
       console.log("Python")
       console.log("JavaScript")
       console.groupEnd()
      

      Output:

    3. groupCollapsed()

      This method is used to combine multiple groups.

      Syntax:

       console.groupCollapsed()
      

      Example:

       // Console.groupCollapsed() method
       console.groupCollapsed();                               
       console.group();         
       console.log('HTML');
       console.log('CSS');
       console.log('JavaScript');
       console.groupEnd();
       console.group('Backend');
       console.log('Node');
       console.log('Express');
       console.log('PSQL');
       console.groupEnd();
      

      Output:

  • Time Methods

    1. time()

      This method starts a timer you can use to track how long an operation takes. Each timer can be given a unique name and nearly 10,000 timers can run on a single page.

      Syntax:

       console.time(label)
      

      The parameter provided should be a string and is optional.

    2. timeEnd()

      This method stops the timer which is started by the time() method.

      Syntax:

       console.timeEnd(label)
      

      To end the timer label provided in time() and timeEnd() should be the same.

      Example:

       //time() and timeEnd() method
       function calculatetime() 
       {
         // time starts method
         console.time("10 iterations");  
         for (let i=0;i<10;i++){
           continue
         } 
         // time-end method
         console.timeEnd("10 iterations")
       }
       calculatetime();
      

      Output:

      I hope this article introduced you to different console methods. All the methods look very simple but highly useful for your debugging journey.

      If something goes wrong in your code these methods give you the ability to find the solution to your problem.

      Want to know more about console methods then click here!!

And that is a wrap. Thanks for Reading!!!

If enjoyed reading this article. Do React, Comment down your views, and share this article with your friends. Please do follow me for more such articles.

Read more of my Work

Create a Discord Bot using Discord.js

My Experience in Building the First NPM Package

How to add a Favicon for a website in HTML

ย