Javascript 简明教程

JavaScript - Console.log()

JavaScript console.log() method

console.log() 是 JavaScript 中最重要的一个方法。它用于在 Web 控制台中打印消息。

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

我们可以使用 console.log() 方法通过在控制台中打印输出对代码进行调试。例如,如果开发人员请求 API 并想要检查作为响应接收到的数据,他们可以使用 console.log() 方法。此外,console.log() 方法还有其他用例。

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

您可以按照下面的语法使用 console.log() 方法——

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

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

您可以通过用逗号分隔不同的消息 (msg1、msg2、…​, msgN) 作为 console.log() 方法的参数来传递不同的消息。

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

每当我们在前端代码中使用 console.log() 方法时,它会在浏览器的控制台中打印输出。

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

以下是在 Chrome 浏览器中打开控制台的快捷方式 -

Here is shortcut to open the console in Chrome browser −

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

大多数浏览器都有相同的快捷键来打开控制台。但是,如果您无法在任何浏览器中打开控制台,您可以在 Google 上搜索。

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.

或者,右键单击鼠标并按照 InspectConsole 选项打开控制台。

Alternatively, to open the Console, right click the mouse and follow InspectConsole options.

Example

在下面的示例中,我们使用 console.log() 方法打印了“Hello World!”消息。

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

此外,我们定义了两个整型变量并使用了另一个 console.log() 方法来打印 num1 和 num2 的总和。在此,开发人员可以观察我们如何在控制台中打印变量。该示例还演示了我们如何在 console.log() 方法参数中执行加法、乘法等操作。

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

在下面的示例中,我们创建了包含名称、域名和描述属性的 JavaScript 对象。我们使用 console.log() 方法在 Web 控制台中打印了该对象。

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

带有后端代码的 console.log() 方法在后端服务器运行的终端中打印输出。

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

Example

我们编写了以下代码,将“Hello World!”消息打印到 app.js 文件中,并使用终端中的“node app.js”命令来运行服务器。它在终端中打印出我们可以观察到的消息。

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!

您可以将 console.log() 方法与前端和后端代码一起使用,通过在控制台中打印输出对代码进行调试。

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