• JavaScript Video Tutorials

JavaScript - Console.log()

JavaScript console.log() method

The console.log() is one of the most important methods in JavaScript. It is used to print the message in the web console.

We can use the console.log() method to debug the code by printing the output in the console. For example, if the developer requests API and wants to check the data received as a response, they might use the console.log() method. Also, there are other use cases of the console.log() method.

Syntax

You can follow the syntax below to use the console.log() method −

console.log(msg1, msg2, …, msgN);

You can pass different messages (msg1, msg2, ...,msgN) by separating them with a comma as a parameter of the console.log() method.

Console.log() with client-sided JavaScript

Whenever we use the console.log() method in the frontend code, it prints the output in the browser's console.

Here is shortcut to open the console in Chrome browser −

  • Press Ctrl + Shift + J together on Windows/Linux and Cmd + Option + J on Mac.

Most browsers have the same shortcut key to open the console. However, if you can’t open the console in any browser, you may search on Google.

Alternatively, to open the Console, right click the mouse and follow Inspect -> Console options.

Example

In the example below, we have printed the "Hello World!" message using the console.log() method.

Also, we defined two integer variables and used another console.log() method to print the sum of num1 and num2. Here, developers can observe how we have printed variables in the console. The example also demonstrates that we can perform addition, multiplication, etc. operations in the console.log() method parameter.

<html>
<head>
   <title> Console.log() method with HTML </title>
</head>
<body>
   <h3> Message is printed in the console </h3>
   <p> Please open the console before clicking "Edit & Run" button </p>
   <script>
      console.log("Hello World!");
      var num1 = 30;
      var num2 = 20;
      console.log("The sum of ", num1, " and ", num2, " is: ", num1 + num2);
</script>
</body>
</html>

It will produce the following result in the Console −

Hello World!
The sum of  30  and  20  is:  50

Example

In the example below, we have created the JavaScript object containing the name, domain, and description properties. We have printed the object in the web console using the console.log() method.

In the console, we can see that it prints the object, and we can expand the object by clicking the arrow given at the start of the object to see the detailed information.

<html>
<head>
   <title> Console.log() method with HTML </title>
</head>
<body>
   <h3> Message is printed in the console </h3>
   <p> Please open the console before clicking "Edit & Run" button </p>
   <script>
	  // Defining the object
	  var obj = {
	     website: "Tutorialspoint",
		 Domain: "www.tutorialspoint.com",
		 description: "This site is for learning."
	  };
      console.log(obj);
   </script>
</body>
</html>

It will produce the following result in the Console −

{website: 'Tutorialspoint', Domain: 'www.tutorialspoint.com', description: 'This site is for learning.'}

Console.log() with server-side JavaScript

The console.log() method with the backend code prints the output in the terminal where the backend server is running.

Example

We have written the below code printing the ‘Hello World!’ message into the app.js file and using the ‘node app.js’ command in the terminal to run the server. It prints the message in the terminal that we can observe. 

let message = "Hello world!";
console.log(message);

This will produce the follwing result −

Hello world!

You can use the console.log() method with frontend and backend code to debug the code by printing output in the console.

Advertisements