調試JavaScript的技巧有哪些

本篇內容介紹了“調試JavaScript的技巧有哪些”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

1. 自動斷點

有時候在執行 JavaScript 代碼的時候，可能來不及設置斷點，代碼就被執行了，其實可以通過在代碼中寫上 debugger(代碼中第 8  行)，讓代碼執行到 debugger 的位置自動暫停。

function a() {     console.log('enter a');     b(); }  function b() {     console.log('enter b');     debugger;     c(); }  function c() {     console.log('enter c'); }  a();

2. 手動斷點

斷點是程序員調試代碼時非常好用的利器，通過斷點調試可以看到當前執行環境中各個變量的值，以及調用堆棧，通過單步執行來查看各個步驟下代碼的運行狀態。如圖所示(Chrome  調試面板 -> sources -> 點擊代碼行號即可添加斷點)：

3. 打印調用堆棧

可以通過調試面板查看當前代碼的調用堆棧，也可以通過 console.trace() 打印函數調用堆棧，下面代碼第 13 行。

4. 以表格的方式打印對象

下面是一個對象，可以通過 console.table( obj ) 來打印這個對象。

let pkg = {     "name": "mini_tools",     "version": "1.0.0",     "description": "",     "main": "index.js",     "dependencies": {         "jquery": "^1.12.4"     },     "devDependencies": {},     "scripts": {         "test": "echo \"Error: no test specified\" && exit 1"     },     "author": "",     "license": "ISC" };  console.table(pkg);

打印結果如圖所示：

“調試JavaScript的技巧有哪些”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！