這裡是修真院前端小課堂，每篇分享文從

【背景介紹】【知識剖析】【常見問題】【解決方案】【編碼實戰】【擴充套件思考】【更多討論】【參考文獻】

八個方面深度解析前端知識/技能，本篇分享的是：

【如何驗證程式是否完成，測試以及修復bug 】

大家好，我是IT修真院北京總院第21期的學員楊夢桐，今天這篇文章主要總結如何驗證程式是否完成，測試以及修復bug

1. 背景介紹

在日常中，我們碼程式碼都是按照需求來的，為了驗證我們驗證我們的工作成果符合我們的專案需求，那麼驗證程式是否完成、測試以及修復bug就成了我們工作中非常重要的流程。

2. 知識剖析

在實際的開發中，最重要的一點是，首先，確定程式是否完成，關於判斷程式已經完成，經過討論，我們想到了如下幾點

a. 從需求的角度看：滿足使用者的全部需求。這是最基本的一點，如果開始了一個專案開發，對整個專案進行架構和邏輯梳理之後，需要將所有的需求都完成。

b. 從程式的角度看：程式碼不存在明顯bug，結構明晰，邏輯通順，有一定的優化。使用者使用時的優化是必須要進行考慮的，比如懶載入的應用等。

c. 從UI圖的角度看：較為完美的還原了UI圖的設計。

d. 從後期版本維護迭代的角度看：註釋完備，穩定性好，不加班的程式碼就是好程式碼。程式碼穩定性好，加班的情況就會顯著降低，註釋完備，一方面是為了讓自己返回過來看原來的程式碼時可以快速的梳理思路，另一方面也是給合作開發增添了很多助力。

驗證程式碼完成，接下來的部分就是測試

測試是使用人工操作或者軟體自動執行的方式來檢驗它是否滿足規定的需求或弄清預期結果與實際結果之間的差別的過程。

總結常用軟體測試的方法如下

a. 按照測試範圍，可以分為模組測試和整體聯調。

b. 按照測試條件，可以分為正常操作情況測試和異常情況測試。

c. 按照測試的輸入範圍，可以分為全覆蓋測試和抽樣測試。

接下來我們來具體分析測試方式之間的區別

a. 模組測試：針對設計中的一個一個模組來進行測試的，目的是保證每個模組作為一個單元能正確執行，所以模組測試通常又被稱為單元測試。在這個測試步驟中所發現的往往是編碼和詳細設計的錯誤。

b. 整體聯調：測試模組間介面的正確性、各模組間的資料流和控制流是否按照設計實現其功能、以及整合後整體功能的正確性。

除此之外，還有正常操作情況測試和異常情況測試。

a. 正常操作情況測試：根據正確的操作流程對單獨的模組或整體進行測試，確定被測物件可以良好執行。

b. 異常情況測試：異常情況，可能會包括資料庫異常，系統異常，使用者異常操作等情況。它具有如下幾個特性。

aa. 成熟性：軟體產品要避免由軟體中錯誤而導致失效的能力。

bb. 容錯性：在軟體失效或者違反規定的介面的情況下，軟體產品維持規定的效能級別的能力。

cc. 易恢復性：在發生故障的情況下，軟體重建規定的效能級別並恢復受直接影響的資料的能力。

dd. 可靠性依從性：軟體產品依附於同可靠性相關的標準、約定或規定的能力

最後，還可區分為全覆蓋測試和抽樣測試。

a. 全覆蓋測試：對於被測物件全面，整體，多維度的測試，受限於時間和人力成本，除非被測物件級別很高，不然不會採用這種測試方式。

b. 抽樣測試：針對功能及模組隨機抽取被測物件。

3. 常見問題及解決方案

經過這麼多測試方法，接下來需要面對的問題就是，如何debug。

而一個常用的方式就是：斷點除錯。

用chrome瀏覽器開啟頁面 → 按f12開啟開發者工具 → 開啟Sources → 開啟你要除錯的js程式碼檔案 → 在行號上單擊一下，這就是斷點除錯。

打好斷點，重新整理頁面，點選下一步，就可以很明確的看出來實際上的執行過程，這是除錯js程式碼的一個十分明確的方式。

4. 擴充套件思考

在這些問題之後，就是“如何儘量減少程式碼bug。”

減少程式碼的bug，最主要的是在敲程式碼之前就明確自己程式設計的思路，捋順邏輯。

ppt ：https://ptteng.github.io/PPT/PPT/js5http.html#/

視訊：https://v.qq.com/x/page/x0529cdyacs.html

問題討論

1. 有chrome自動斷點除錯jquery程式碼的現象

傳入的引數不合法，可能到導致 jquery 中的程式碼執行異常，如果開啟了“異常時自動斷點”，就有可能自動跳到jquery裡，可以設定blackbox script 的功能來忽略 jquery 中的斷點。

2. 抽樣測試的概念還是不夠理解

對整體專案隨機抽取任意模組進行功能和程式碼的測試

3.  程式碼的容錯性是什麼意思？

比如sessionstorage，localstorage，cookie的具體應用，要考慮它們實際上在什麼情況下進行應用，如何清除這幾種快取

作者：AmaYang
連結：https://www.jianshu.com/p/4811f3ca255b
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯絡作者獲得授權並註明出處。

更多內容，可以加入IT交流群565734203與大家一起討論交流

這裡是技能樹·IT修真院：https://www.jnshu.com，初學者轉行到網際網路的聚集地