js中除錯技巧 列印日誌資訊

2022-07-16 10:39:12 字數 1438 閱讀 7718

平常除錯**的時候, 大部分情況下我們會採用console.log的形式進行處理.

但是這個是非常費事費力的一件事情. 因為這個地方是要進行**的修改, 然後經過**的 reload 之後,

是一件非常低效的事情.而我們程式設計師是不會做低效的事情的

針對自己在工作中的場景, 總結了一下幾種比較搞笑的方法進行列印

使用 dev-tools 列印變數資訊

chrome 除錯工具非常強大, 我們可以首先採用其中的除錯工具來進行列印

watcher 選擇除錯的**變數或者表示式, 將其加入到 觀察佇列中, 執行到此處就會顯示出資訊

增加斷點log, 看圖說話, 另外的幾個功能也非常實用. 跟增加條件斷點類似, 不過這裡的會在控制台直接列印出來

要說的是: 如果想設定一些額外資訊, 也可以將變數掛載到 windows 全域性上, 然後在下乙個斷點進行使用, 非常方便

手工輸入 console.log. 可以實現將需要處理的變數掛載到 全域性 windows 上去.

比如我需要觀察obj物件, 然後我可以這個樣子

```js

window.obj = obj;

```這樣處理的時候, 只要在控制台直接輸出 `console.log(window.obj)` 就可以了.

列印呼叫棧資訊

本來寫這個主題就是列印堆疊資訊的, 一下子變成列印日誌資訊了....

console.trace(). 專事專辦, 這個方法就是可以用來記錄的.

如果不支援, 我們可以通過 arguments 中的 callee 和 caller 進行 (如果 es6 禁用掉了的話..., 那 console.trace 方法肯定支援)

方法如下

function trace () 

} //增加一下層及控制

//level: number

function trace(level = 0)

}

callee 其實就是方法自己, 通過 arguments 可以訪問到

caller 指向呼叫當前方法的物件

所以, 比如以下**

function a() 

function b()

function c()

c();

就會列印

ƒ c()
chrome 還支援將列印的日誌直接儲存成檔案, 便於統一通過 ide 進行分析

在列印輸出的日誌上邊 右鍵 另存為即可~

vc 除錯資訊輸出 列印除錯資訊

1.cdumpcontext 該類沒有基類。這個類支援面向流的診斷輸出,以人能夠閱讀的文字。該類過載了 操作符。afxdump是乙個預宣告的cdumpcontext物件,可以方便使用。該物件只在mfc的debug版中有效。可以將調式資訊輸出到除錯輸出視窗或除錯終端。example for afxdu...

Logcat列印除錯資訊

android logcat除錯中的v d i w e的分別代表什麼?log.v 黑色 verbose info log.d 藍色 debug info log.i 綠色 info log.w 橙色 warn log.e 紅色 error info 斷言 的除錯顏色為黑色的,任何訊息都會輸出,這裡的...

JS除錯技巧

我們在除錯 時,往往追求優雅而高效的寫 所以就出現了一系列除錯 的方法。這兒根據我的實際遇到的來講講這些除錯方法。1 alert 不推薦使用 不推薦使用的除錯方法,那我為啥放第乙個呢,因為這是初學者剛接觸js時的必經之路。優點 初學者入門 說笑了,現在來看,這個方法幾乎沒有啥優點 缺點 1 aler...