作為Web開發人員，很有必要了解如何調試代碼。后臺開發我們經常使用外部庫來記錄日志，并在某些情況下格式化顯示日志，前端我們會使用斷點和控制臺，但是我們瀏覽器的控制臺比我們想象的要強大得多。

當我們考慮控制臺時，首先想到的是console.log，對吧？但是它比我們想像中使用的方法多得多。現在我們來看一下如何充分利用控制臺，我將為您提供一些技巧，使這些方法更具可讀性

什么是控制臺？

JavaScript控制臺是現代瀏覽器中的內置功能，它在類似shell的界面中帶有開箱即用的開發工具。它允許開發人員：

• 查看網頁上發生的錯誤和警告的日志。
• 使用JavaScript命令與網頁交互。
• 調試應用程序并直接在瀏覽器中遍歷DOM。
• 檢查和分析網絡活動 基本上，它使您能夠在瀏覽器中編寫，管理和監控JavaScript。

Console.log，Console.error，Console.warn和Console.info 這些可能是最常用的方法。您可以將多個參數傳遞給這些方法。每個參數都在由空格分隔的字符串中進行計算和連接，但是對于對象或數組，您可以在它們的屬性之間導航。

Console.group

在檢查代碼邏輯和流程時我們可能會使用很多的console.log()來檢測，但是你會發現控制臺打印出來的非常多。此方法允許您在可折疊的組下對一系列console.log（以及錯誤信息等）進行分組。語法非常簡單：只需console.log在之前輸入我們想要分組的所有內容console.group()（或者console.groupCollapsed()如果我們希望它默認關閉）。然后console.groupEnd()在末尾添加一個關閉組。

Console.table

自從我發現console.table我的生活都發生了改變。在一個內部顯示JSON或非常大的JSON數組console.log是一種不好的體驗。這console.table允許我們在一個漂亮的表中可視化這些結構，我們可以在其中命名列并將它們作為參數傳遞。

非常好，在調試中非常有用：

Console.count，Console.time和Console.timeEnd 對于需要調試的每個開發人員來說，這三種方法都是瑞士軍刀。該console.count計數和輸出是的次數count()已被調用在同一行，并用相同的標簽。該console.time開始用指定為輸入參數的名稱定時器，可以運行多達10,000個特定網頁上同時定時器。啟動后，我們使用調用來console.timeEnd停止計時器并將經過的時間打印到控制臺。

輸出將如下所示：

Console.trace和Console.assert

這些方法只是從調用它的代碼位置，打印堆棧跟蹤。想象一下，您正在創建一個JS庫，并希望通知用戶生成錯誤的位置。在這種情況下，這些方法非常有用。該console.assert是喜歡console.trace，但是只打印條件不符合的。

正如我們所看到的，輸出正是React（或任何其他庫）在生成異常時向我們展示的內容。

刪除所有控制臺?

使用控制臺通常會迫使我們消除它們。或者有時候我們會忘記生產構建（并且只會在幾天和幾天之后錯誤地注意它們）。當然，我不建議任何人濫用不需要它們的控制臺（更改輸入句柄中的控制臺可以在看到它工作后刪除）。您應該在開發模式下保留錯誤日志或跟蹤日志以幫助您進行調試。我在工作和我自己的項目中都經常使用Webpack。此工具允許您使用uglifyjs-webpack-plugin從生產版本中刪除您不想保留的所有控制臺（按類型）?

const UglifyJsPlugin = require('uglifyjs-webpack-plugin') var debug = process.env.NODE_ENV !== "production";..... optimization: {minimizer: !debug ? [new UglifyJsPlugin({// Compression specific optionsuglifyOptions: {// Eliminate commentscomments: false,compress: {// remove warningswarnings: false,// Drop console statementsdrop_console: true},}})] : [] }

配置非常簡單，它簡化了工作流程，所以控制臺還是很好玩的（但不要濫用它！）

更多專業前端知識，請上 【猿2048】www.mk2048.com

總結

以上是生活随笔為你收集整理的如何使用JavaScript控制台改进工作流程的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。