目錄
1、什麼是單元測試?有什麼用?
2、JavaScript單元測試現況
3、單元測試常用框架
首頁 web前端 前端問答 JavaScript單元測試有什麼用

JavaScript單元測試有什麼用

Jun 22, 2021 pm 03:44 PM
javascript 單元測試

在JavaScript中,單元測試是針對程式模組(軟體設計的最小單位)來進行正確性檢驗的測試工作,其目標是隔離程式模組並證明這些單一模組是正確的。單元測試能確保在開發過程的早期就發現問題,可以讓程式設計師方便檢查程式碼片段是否依然正常運作。

JavaScript單元測試有什麼用

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

1、什麼是單元測試?有什麼用?

在電腦程式設計中,單元測試(又稱模組測試)是針對程式模組(軟體設計的最小單位)來進行正確性檢驗的測試工作。程式單元是應用的最小可測試部件。在過程化編程中,一個單元就是單一程式、函數、過程等;對於物件導向編程,最小單元就是方法,包括基底類別(超類別)、抽象類別、或衍生類別(子類別)中的方法。

每個理想的測試案例獨立於其它案例;為測試時隔離模組,經常使用stubs、mock 或fake等測試馬甲程式。單元測試通常由軟體開發人員編寫,用於確保他們所寫的程式碼符合軟體需求並遵循開發目標。

單元測試的目標是隔離程式模組並證明這些單一模組是正確的。單元測試能確保在開發過程的早期就能發現問題,是為了讓程式「死得更早」。我們應該從開發的早期就為所有函數和方法編寫單元測試,可讀性強的單元測試可以使程式設計師方便地檢查程式碼片段是否依然正常運作。良好設計的單元測試案例涵蓋程式單元分支和循環條件的所有路徑。採用這種自底向上的測試路徑,先測試程式模組再測試模組的集合,一旦變更導致錯誤發生,借助單元測試可以快速定位並修復錯誤。

2、JavaScript單元測試現況

單元測試在背景開發中非常流行且普及,例如JAVA開發者的JUnit等,而在前端開發中則使用的非常少。究其原因,主要是單元測試更適用於邏輯程式碼的測試,這對於JAVA等後台程式語言來說測試起來非常方便,但是前端開發很多時候要要UI打交道,UI相關的程式碼不是不可以進行單元測試,但的確很麻煩,比起邏輯程式碼來說困難多了,這就導致了單元測試在前端開發沒有普及起來。

但隨著單元測試的普及,尤其是敏捷開發的推動,湧現了許多優秀的JavaScript單元測試框架,如QUnit、Jasmine等。所有的這些框架基本上都能對Javascript程式碼進行很好的測試,當然UI部分的程式碼測試一樣比較麻煩,但是我們可以透過精心建構我們的測試程式碼來測試部分UI程式碼。但是每個框架都不是萬能的,它們都有各自擅長的領域,下面選取了幾個代表性的框架來介紹。

3、單元測試常用框架

l   QUnit框架

a) 簡介

QUnit是jQuery團隊開發的JavaScript單元測試工具,功能強大且使用簡單。目前所有的JQuery程式碼都使用QUnit進行測試,原生的JavaScript也可以使用QUnit。

最初,John Resig將QUnit設計為jQuery的一部分。 2008年,QUnit才有了自己的名字、首頁和API文檔,也開始允許其他人用它來做單元測試。但當時QUnit還是基於jQuery的。直到2009年,QUnit才可以完全的獨立運作。

b)優點

使用起來非常方便,有漂亮的外觀和完整的測試功能(包括非同步測試);

#非常簡單,容易上手,目前公開的API只有19個;

不需要依賴其它任何軟體包或框架,只要能運行JS的地方就可以,QUnit本身只有一個JS文件和CSS文件,當然如果需要可以和jQuery等其它框架集成;

不僅支援在瀏覽器中測試,還支援在Rhino和node.js等後端測試。

c) 不足

對自動化支援不好,很難和Ant、Maven或自動建置等工具集成,主要用在瀏覽器中進行測試。

l  Jasmine框架

a)簡介

Jasmine是一個有名的JavaScript單元測試框架,它是獨立的行為驅動開發框架,語法清晰易懂。

行為驅動開發(BDD):是一種敏捷軟體開發的技術,它鼓勵軟體專案中的開發者、QA和非技術人員或商業參與者之間的協作。 BDD最初是由Dan North在2003年命名,它包括驗收和客戶測試驅動等的極限編程的實踐,作為對測試驅動開發的回應。在過去的數年裡,得到了極大的發展。

BDD的重點是透過與利害關係人的討論來取得對預期的軟體行為的清醒認識。它透過用自然語言書寫非程式設計師可讀的測試案例擴展了測試驅動開發方法。行為驅動開發人員使用混合了領域中統一的語言的母語語言來描述他們的程式碼的目的。這讓開發者得以把精力集中在程式碼應該怎麼寫,而不是技術細節上,而且也最大程度的減少了將程式碼編寫者的技術語言與商業客戶、使用者、利害關係人、專案管理者等的領域語言之間來回翻譯的代價。

BDD的做法包括:

l  確立不同利害關係人要實現的遠景目標

l  使用特性注入法繪製出達到這些目標所需的特性

l  透過由外及內的軟體開發方法,將涉及的利害關係人融入實現的過程中

l  使用範例來描述應用程式的行為或程式碼的每個單元

l  透過自動執行這些例子,提供快速回饋,進行回歸測試

l  使用「應當(should)」來描述軟體的行為,以幫助闡明程式碼的職責,以及回答對該軟體的功能性的質疑

l  使用「確保(ensure)」來描述軟體的職責,以便將程式碼本身的效用與其他單元(element)程式碼帶來的邊際效用中區分出來。

l  使用mock作為尚未編寫的相關程式碼模組的替身

BDD特性注入:一個公司可能有多個會帶來商業利益的不同願景,通常包括盈利、省錢或保護錢。一旦某個願景被開發小組確定為當前條件下的最佳願景,他們將需要更多的幫助來成功實現這個遠景。

然後確定該願景的主要利害關係人,會帶入其他的利害關係人。每個相關者要定義為了實現該願景他們需要完成的目標。例如,法務部門可能要求某些監管要滿足。行銷負責人可能要參加將使用該軟體的使用者的社群。安全專家需要確保軟體不會受到SQL注入的攻擊。

透過這些目標,會定義出要達成這些目標所需的大概的題目或特性集合。例如,「允許使用者排序貢獻值」或「交易審計」。從這些主題,可以確定使用者功能以及使用者介面的第一批細節。

b)       優點

它是一個基於行為驅動開發實現的測試框架,它的語法非常貼近自然語言,簡單明了,容易理解。

能很方便的和Ant、Maven等進行集成進行自動化測試,也可以方便和Jekins等持續集成工具進行集成,可以產生測試結果的XMl文檔。

它有豐富的API,同時使用者也支援使用者擴充它的API,這一點很少有其它框架能夠做到。

使用方便簡單,只需引入兩個js檔案即可

不僅支援在瀏覽器中測試,還支援在Rhino和node.js等後端測試。

對於Ruby語言有特別的支持,能夠非常方便的整合到Ruby專案中去

#c) 不足

在瀏覽器中的測試介面不如QUnit美觀、詳細。

l  JsTestDriver

a)        簡介

#JsTestDriver是一個JavaScript單元測試工具,易於與持續建構系統整合並且能夠在多個瀏覽器上運行測試輕鬆實現TDD風格的開發。當在專案中配置好JsTestDriver以後,如同junit測試java檔案一般,JsTestDriver可以直接透過執行js檔案來進行單元測試。 JsTestDriver框架本身就是JAVA的jar包,需要在本地運行並監聽一個連接埠。

b)       優點

可以一次測試多個瀏覽器,使用方法是在啟動服務時可以將多個瀏覽器的路徑作為參數傳進去。可以在多台機器上的瀏覽器中運行,包括行動裝置。

測試運行得很快,因為不需要將結果添加到DOM中呈現出來,它們能夠同時在任意多的瀏覽器中運行,未修改的文件瀏覽器會從快取提取。

不需要HTML配件文件,只需提供一個或多個腳本和測試腳本,測試執行器運行時就會建立一個空文件。

能很方便的和Ant、Maven等進行集成進行自動化測試,也可以方便和Jekins等持續集成工具進行集成,可以產生測試結果的XML文件。

有Eclipse和IntelliJ插件,可以很方便的在這兩個IDE中進行測試,和JUnit很像。

支援其它測試框架,可以測試其它測試框架寫的測試程式碼,例如有對應的插件可以將QUnit和Jasmine測試程式碼轉換成JsTestDriver的測試程式碼。

c) ​​       不足

#在瀏覽器中無法測試,且只能透過自動化工具或控制台運作。產生的結果不夠直觀。

安裝使用稍微有點麻煩,依賴JAVA環境。

l  FireUnit

a)        簡介

FireUnit是基於Firebug的Javascript的單元測試架構。簡單說來,FireUnit為Firebug增加了一個標籤面板,並提供了一些簡單的JavaScript API來記錄和檢視測試。

b)       優點

簡單易用

c) ​​      不足

#功能不多,測試程式碼常寫在原始碼裡,雖然可以即時觀看到效果,但耦合太強,不易清理

只運行在Firefox下

[相關推薦:javascript學習教學

以上是JavaScript單元測試有什麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Java 中介面和抽象類別的單元測試實踐 Java 中介面和抽象類別的單元測試實踐 May 02, 2024 am 10:39 AM

針對Java中介面和抽象類別進行單元測試的步驟:介面建立一個測試類別。建立一個模擬類別來實作介面方法。使用Mockito庫模擬介面方法並編寫測試方法。抽象類別建立一個測試類別。建立抽象類別的子類別。編寫測試方法來測試抽象類別的正確性。

PHP 單元測試工具的優缺點分析 PHP 單元測試工具的優缺點分析 May 06, 2024 pm 10:51 PM

PHP單元測試工具分析:PHPUnit:適用於大型項目,提供全面功能,易於安裝,但可能冗長且速度較慢。 PHPUnitWrapper:適合小型項目,易於使用,針對Lumen/Laravel優化,但功能受限,不提供程式碼覆蓋率分析,社群支援有限。

Go語言中的效能測試與單元測試的差異 Go語言中的效能測試與單元測試的差異 May 08, 2024 pm 03:09 PM

效能測試評估應用程式在不同負載下的效能,而單元測試驗證單一程式碼單元的正確性。效能測試著重於測量反應時間和吞吐量,而單元測試則關注函數輸出和程式碼覆蓋率。性能測試透過高負載和並發模擬實際環境,而單元測試在低負載和串行條件下運行。效能測試的目標是識別效能瓶頸和最佳化應用程序,而單元測試的目標是確保程式碼正確性和健全性。

如何在 Golang 單元測試中使用表格驅動的測試方法? 如何在 Golang 單元測試中使用表格驅動的測試方法? Jun 01, 2024 am 09:48 AM

表驅動的測試在Go單元測試中透過表定義輸入和預期輸出簡化了測試案例編寫。語法包括:1.定義一個包含測試案例結構的切片;2.循環遍歷切片並比較結果與預期輸出。在實戰案例中,對字串轉換大寫的函數進行了表格驅動的測試,並使用gotest運行測試,列印通過結果。

單元測試與整合測試在golang函數測試中的差異? 單元測試與整合測試在golang函數測試中的差異? Apr 27, 2024 am 08:30 AM

單元測試和整合測試是兩種不同的Go函數測試類型,分別用於驗證單一函數或多個函數的交互和整合。單元測試只測試特定函數的基本功能,整合測試測試多個函數之間的互動和與應用程式其他部分的整合。

PHP單元測試:如何設計有效的測試案例 PHP單元測試:如何設計有效的測試案例 Jun 03, 2024 pm 03:34 PM

設計有效的單元測試案例至關重要,遵循以下原則:原子性、簡潔、可重複和明確。步驟包括:確定要測試的程式碼、識別測試場景、建立斷言、編寫測試方法。實戰案例示範了為max()函數建立測試案例,強調了特定測試場景和斷言的重要性。透過遵循這些原則和步驟,可以提高程式碼品質和穩定性。

PHP 單元測試與持續交付的集成 PHP 單元測試與持續交付的集成 May 06, 2024 pm 06:45 PM

摘要:透過整合PHPUnit單元測試框架和CI/CD管道,可以提高PHP程式碼品質並加速軟體交付。 PHPUnit允許建立測試案例來驗證元件功能,而GitLabCI和GitHubActions等CI/CD工具可自動執行這些測試。範例:透過測試案例驗證身份驗證控制器,以確保登入功能能如預期運作。

PHP 單元測試:增加程式碼覆蓋率的技巧 PHP 單元測試:增加程式碼覆蓋率的技巧 Jun 01, 2024 pm 06:39 PM

PHP單元測試中提高程式碼覆蓋率的方法:使用PHPUnit的--coverage-html選項產生覆蓋率報告。使用setAccessible方法覆寫私有方法和屬性。使用斷言覆蓋布林條件。利用程式碼審查工具獲得額外的程式碼覆蓋率洞察。

See all articles