除錯能力是一個程式設計師的生存根本，可是很多初學者卻忽視除錯。今天我們就來討究一下JS的除錯技巧。

本文章將會詳細列舉JS相關的各種實用除錯技巧。如果您是JS的初學者，那麼這篇文章將對您有很大的幫助。

為什麼要除錯？

程式就是函式堆砌起來的，程式的執行就是函式的執行過程。而透過JS除錯，我們可以更為直觀的追蹤到在程式執行中，函式的執行順序，以及各個引數的變化。這樣我們就可以快速的定位到問題所在。

1. 什麼是JS除錯？

在程式執行中，我們總會遇到各種bug，而透過程式碼的追蹤程式碼的執行順序從而定位到問題的過程就叫做JS除錯。

首先我們需要知道如何進入除錯的介面，此處我們以谷歌為例，透過F12和右鍵檢查，找到Sources就可以進入除錯介面。具體介面顯示如下：

紅框所標示的就是我們除錯常用的按鍵。下面我們會在實際應用場景中詳細講述每一個按鍵的作用。

2． 單步除錯

3． 函式除錯

如果親手嘗試過單步除錯的小夥伴就會發現，單步除錯其實並不能滿足我們找bug的需求，因為單步除錯是不能進入函式體內，我們也就不能跟蹤函式體內變數的變化。

4． 斷點除錯

在實際專案程式碼量是很大的，使用單步除錯就過於的浪費時間。而且有時我們是想要定位某一處的程式碼是否有錯，所以就沒有必要除錯所有的程式碼。所以我們就可以使用斷點除錯，那麼什麼是斷點除錯呢？

5． 事件除錯

首先我們要來明確一個概念，就是同步與非同步，當代碼執行時，自上而下執行的為同步程式碼，而非同步程式碼其中一類就是需要事件來觸發。所以在程式碼除錯中，事件體內的函式，需要在打斷點後，透過該事件的行為，才能進入函式體。

如以下程式碼：打斷點後在重新整理，其實沒有效果

必須動過事件才能觸發除錯