Javascript 简明教程

JavaScript - Console Object

Window Console Object

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

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

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

Console Object Methods

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

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

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

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

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

JavaScript console.log() Method

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

Syntax

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

console.log(expression);

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

Example

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

<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() 方法在控制台中打印错误消息，用红色背景突出显示错误。

Syntax

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

console.error(message);

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

Example

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

<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() 方法可用于清除控制台。

Syntax

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

console.clear()

Example

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

<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

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

Method

Method Description

assert()

如果作为参数传递的断言为假，则会在控制台中打印错误消息。

clear()

It clears the console.

count()

它用于计算在特定位置调用 count() 方法的次数。

error()

它在控制台中显示错误消息。

group()

它用于在控制台中创建一组消息。

groupCollapsed()

它用于在控制台中创建一个新的折叠消息组。

groupEnd()

它用于结束该组。

info()

它在控制台中显示信息或重要消息。

log()

它将消息打印至输出中。

table()

它以表格格式在控制台中显示数据。

time()

它用于在控制台中开始计时。

timeEnd()

它停止由 time() 方法开始的计时。

trace()

它在控制台中显示堆栈跟踪。

warn()

它在控制台中显示警告消息。