其實說到調試技巧，我相信現在會有很多種類的調試技巧，每個人都有自己的調試方式方法；
現在我把我自己的調試技巧總結一下，也許會對其他的小夥伴有幫助；
1.日誌調試
這種調試方案是最方便簡明的，直接在需要調試的代碼處console.log（xxx），可以直接打印出所需要的數據，一目瞭然；
添加console.log(),之後可以直接在控制檯看到所需要打印的數據，可以根據這個數據進行調試，查看效果；但是有一個比較麻煩的地方，就是在prod環境的時候要屏蔽掉
console.log();當然現在構建工具是可以很輕鬆做到這一點的，不過也算是需要處理，難免也算一個麻煩的地方；
這種調試方法
推薦指數還是挺高的，3星吧；
2.Bom的alert
這種調試方法很少使用，因爲限制太多，用戶體驗太差，而且數據不全，當調試數據是Object的時候，會出現[object Object]，這樣的顯示，而且會直接阻斷瀏覽器進程，用戶體驗較差，且數據並不完善，各個瀏覽器彈出的樣式還不統一一致；但是使用起來也是很簡單，直接alert（xxxx）即可，不過如果prod環境沒有刪除的話。會出現非常差的用戶體驗。
因此不推薦；
3.debugger
這種調試方案其實來自於java，使用方式也是很簡單，直接在代碼中需要斷點的地方，直接debugger即可，當js執行到該語句的時候，會自動暫停，頁面會出現蒙層卡住，然後會自動跳轉到debugger代碼處，處於當前執行環境的數據將鼠標移動到該數據上會顯示出來，是一種很簡便的調試方法，不過後面一定要刪除該語句，否則的話一旦用戶不小心點開開發者工具（F12），就會進入debugger，也會影響用戶體驗的。
當點擊頁面中的前進按鈕的時候就會跳轉到下一個斷點處，全部跳轉完成後斷點就會結束。
4.瀏覽器斷點
在瀏覽中斷點其實是一種比較好的方式，可以省去刪除代碼中bedugger的方式，首先需要有項目源代碼的soureceMap，webpack打包工具裏面會默認開啓sourceMap的配置，可以直接在瀏覽器裏面斷點，在行數的地方可以直接加上斷點，F8可以直接跳轉到下一個斷點，F10可以單步驟調試，F11可以直接進入方法，也相當於單步調試了。
5.移動端webview頁面調試（android）
目前chrome瀏覽器的話使用的較多，而且集成的開發者工具是目前比較好用的調試方案；
可以在瀏覽器地址裏面輸入：
chrome://inspect/#devices
如果不想直接輸入，也可以在chrome的擴展工具裏面下載adb這個插件，使用這個也是可以的；使用手機連接電腦後，默認彈窗後點擊允許電腦調試即可可以在該頁面中看到所需要調試的頁面，下面會有對應的地址；
app如果不是原生，而是h5頁面嵌入的話，也是可以直接進行調試的；調試方法上面已經說過了，哪一種都是可以的
6.移動端webview頁面調試 （ios）
目前市面上基本使用safari瀏覽器中的開發頁面進行調試，但是必須要基於ios系統，window系統的話，這個是不可以調試的。
不過在github上提供了一種方式，就是使用ios-webkit-debug-proxy這個插件，
使用前需要在iphone的設置中開啓safari-》高級-》-》Web檢查器；
之後一般電腦裏面都安裝了node吧，如果沒有的話，可以安裝一下node，挺方便的。
之後通過node的安裝命令
npm install ios-webkit-debug-proxy -g
安裝之後需要啓動ios-webkit-debug-proxy
ios_webkit_debug_proxy -f chrome-devtools://devtools/bundled/inspector.html
開啓之後，會顯示
Listing devices on :9221
Connected :9222 to iphoneName
之後在瀏覽器器裏面打開
localhost：9221
打開的話裏面就可以進行調試了，將iphone連接到電腦上就可以調試手機頁面了；
7.控制檯調試
其實還有一種比較投機的方法調試ios設備，當然android也是可以的，就是實際上ios設備內核使用的都是safari瀏覽器內核的，safari瀏覽器也都知道是ios的標配，windows系統是很少有safari瀏覽器的。
但是實際上window也是可以安裝safari瀏覽器的，只不過是有版本的限制，最高的版本肯定是不行的，目前根據蘋果官網證明safari 5.1.7 for window是最後一個版本支持window的，這個版本的safari是可以下載到的。
然後開啓開發者模式，在這個瀏覽器裏一般是可以模擬iphone手機的環境的，可以在這個控制檯寫一些具有兼容性的代碼，看看執行的情況，往往是可以解決很多ios上莫名其妙的問題的，例如我之前就通過這個瀏覽器的控制檯找到了一處時間的bug，因爲ios是沒辦法解析'2018-12-12'這樣的時間的，android是正常的，但是iphone手機就會出現nan年nan月nan日，部分兼容性的問題是可以在這裏看到的；
同樣，在這裏也是可以書寫js代碼的，不確定的話，可以在寫好測試好在直接code進源代碼中；
8.微信調試
如果發現在微信中頁面出現一些很詭異的地方，怎麼調試呢？之前的話，微信在chrome的chrome://inspect/#devices是不可以調試的，現在已經可以了，不過之前不可以的時候，我也找到了一個微信提供的軟件去調試，這個軟件叫微信web開發者工具而不是微信開發者工具，都是微信官方提供的，名字只差一個web，但是功能可是千差萬別的，
微信web開發者工具是調試頁面的，具有調試功能；
微信開發者工具是開發小程序和微信的，不具備url單頁面調試功能，當然項目是可以調試的；
這個具體的使用方法我就不多說了，程序裏面寫的很明確，我就不多贅述了；
以上基本涉及了各個領域的調試技巧，因爲是本人自行總結，可能會存在問題或者遺漏，如有發現的話，麻煩留言提出，謝謝！