Javascript 简明教程

JavaScript - Console Object

Window Console Object

在 JavaScript 中，“console”对象是 window 对象的属性。它允许开发者访问浏览器的调试控制台。

In JavaScript, the 'console' object is a property of the window object. It allows the developers to access the debugging console of the browser.

console 对象包含用于不同功能的各种方法。在 Node.js 中，console 对象用于与终端交互。

The console object contains the various methods used for different functionalities. In Node.js, the console object is used to interact with the terminal.

我们使用 window 对象或不使用 window 对象（window.console 或仅 console）访问 console 对象。

We access the console object using the window object or without using the window object - window.console or just console.

Console Object Methods

console 对象上有许多可用的方法。这些方法用于执行许多任务，例如测试、调试和日志记录。

There are many methods available on the console object. These methods are used to perform a number of task such testing, debugging and logging.

您可以使用以下语法访问“console”对象方法：

You may access the 'console' object methods using the following syntax −

window.console.methodName();
OR
console.methodName();

您可以在控制台中观察输出。要打开控制台，请使用 Ctrl + Shift + I 或 Cmd + Shift + I 键。

You can observe outputs in the console. To open the console, use the Ctrl + shift + I or Cmd + shift + I key.

下面，我们将介绍 console 对象的一些方法并提供示例。

Below, we will cover some methods of the console object with examples.

JavaScript console.log() Method

您可以使用 console.log() 方法在调试控制台中打印消息。它将表达式或文本消息作为参数。

You can use the console.log() method to print the message in the debugging console. It takes the expression or text message as an argument.

Syntax

按照以下语法使用 console.log() 方法。

Follow the syntax below to use the console.log() method.

console.log(expression);

在以上语法中，表达式可以是变量、数学表达式、字符串等，您需要它们在控制台中打印出来。

In the above syntax, the expression can be a variable, mathematical expression, string, etc., which you need to print in the console.

Example

在下面的代码中，单击该按钮将调用“printMessage”函数。该函数在控制台中打印字符串文本和数字值。

In the below code, clicking the button will invoke the 'printMessage' function. The function prints the string text and number value in the console.

<html>
<body>
   <h2> JavaScript console.log() Method </h2>
   <button onclick = "printMessage()"> Print Message in Console </button>
   <p> Please open the console before you click "Print Message in Console" button</p>
   <script>
      function printMessage() {
         console.log("You have printed message in console!");
         let num = 10;
         console.log(num);
      }
   </script>
</body>
</html>

JavaScript console.error() Method

console.error() 方法在控制台中打印错误消息，用红色背景突出显示错误。

The console.error() method prints the error message in the console, highlighting the error with a red background.

Syntax

按照以下语法使用 console.error() 方法。

Follow the syntax below to use the console.error() method.

console.error(message);

console.error() 方法将消息作为参数。

The console.error() message takes a message as an argument.

Example

在下方的代码中，printError() 函数在点击按钮时会将错误记录在控制台中。你可以看到，该错误已以红色背景高亮显示。

In the below code, printError() function logs the error in the console when you click the button. You can observe the error highlighted with the red background.

<html>
<body>
   <h2> JavaScript console.error() Method </h2>
   <button onclick="printError()"> Print Error Message in Console </button>
   <p> Please open the console before you click " Print Error Message in Console" button.</p>
   <script>
      function printError() {
         console.error("Error occured in the code!");
      }
   </script>
</body>
</html>

JavaScript console.clear() Method

console.clear() 方法可用于清除控制台。

The console.clear() method clears the console.

Syntax

按照下方语法使用 console.clear() 方法。

Follow the syntax below to use the console.clear() method.

console.clear()

Example

在下方的代码中，我们向控制台打印消息。之后，在点击按钮后，它执行 clearConsole() 函数并使用 console.clear() 方法清除控制台。

In the below code, we print messages to the console. After that, when you click the button, it executes the clearConsole() function and clears the console using the console.clear() method.

<html>
<body>
   <h2> JavaScript console.clear() Method </h2>
   <button onclick = "clearConsole()"> Clear Console </button>
   <p> Please open the console before you click "Clear Console" button</p>
   <script>
      console.log("Hello world!");
      console.log("Click the button to clear the console.");
      function clearConsole() {
         console.clear();
      }
   </script>
</body>
</html>

The console object methods list

此处，我们列出了控制台对象的所有方法。

Here, we have listed all methods of the console object.

Method

Method Description

assert()

It prints the error message in the console if the assertion passed as a parameter is false.

clear()

It clears the console.

count()

It is used to count how many times the count() method is invoked at a specific location.

error()

It displays the error message in the console.

group()

It is used to create a group of messages in the console.

groupCollapsed()

It is used to create a new collapsed group of messages in the console.

groupEnd()

It is used to end the group.

info()

It shows the informational or important message in the console.

log()

It prints the message into the output.

table()

It shows the data in the tabular format in the console.

time()

It is used to start the time in the console.

timeEnd()

It stops the timer started by the time() method.

trace()

It displays the stack trace in the console.

warn()

It shows the warning message in the console.