# Day 45：測試框架與 JavaScript 函式進階

**Published by:** [雞蛋糕的前端修煉屋](https://paragraph.com/@gcake/)
**Published on:** 2026-01-23
**URL:** https://paragraph.com/@gcake/day-45

## Content

今日閱讀進度《單元測試的藝術》3/e 第二章 ~ 2.4 (p. 46)《JavaScript 概念三明治》第四章完、第五章 p.5-23測試框架核心概念測試框架的四大角色測試框架不只是幫你跑測試,它整合了四個關鍵元件: developer.mozilla測試程式庫:提供組織測試的結構 (如 describe、it)斷言庫:用 expect 驗證預期結果測試執行器:自動化執行所有測試結果報告器:視覺化呈現測試通過/失敗狀態Jest 與 Vitest 還額外提供隔離設施,確保每個測試獨立運行,不互相干擾 ibraheem為什麼要用測試框架?使用測試框架帶來的四大優勢: developer.mozilla結構明確:程式碼組織清楚,可讀性高快速迭代:複製測試結構,新測試寫得更快建立信心:節省手動驗證時間,更敢重構共同語言:團隊對測試報告有一致理解易錯提醒⚠ 使用測試框架 ≠ 寫出好測試 測試框架只是工具,它不保證:測試程式本身易讀、易維護測試涵蓋所有想驗證的邏輯測試具有可信度關鍵在於如何設計測試,而非只會使用框架語法 ibraheem實作狀態✅ 已完成:fork kata repo,移除 Jest 改用 Vitest 環境設定 ⏳ 待完成:實作測試練習題JavaScript 型別系統原始型別 vs 物件型別判斷原則:除了原始型別,其他都是物件型別 developer.mozilla 原始型別(Primitive Types)共 6 種:null / undefinednumber / string / booleansymbol (較少用,透過 Symbol() 產生)物件型別:陣列、物件、函式等 特別注意:函式是「可被呼叫的物件」,既可以當函式執行,也能當物件使用 developer.mozilla函式的進階概念陳述式 vs 表達式陳述式(Statement):一段描述邏輯的程式碼表達式(Expression):能被 JavaScript 運算並產生數值的程式碼兩種函式寫法// 函式陳述式 - 宣告函式 function greet(name) { return `Hello, ${name}`; } // 函式表達式 - 把函式指派給變數 const greet = function(name) { return `Hello, ${name}`; }; 函式作為物件的特性函式具有 name 屬性,可以查看函式名稱: developer.mozillafunction calculateTotal() { // 計算邏輯 } console.log(calculateTotal.name); // "calculateTotal" 函式的三種用途:當作參數傳進另一個函式 (高階函式 HOF)模擬物件導向的「類別」寫法利用 IIFE 建立獨立作用域立即執行函式(IIFE)使用情境IIFE 的設計目的: developer.mozilla讓程式碼在全域環境載入後立即執行利用函式作用域限制變數存取達到與全域環境隔離的效果(function() { const privateVar = '不會污染全域'; console.log('立即執行'); })(); 下一步學習規劃[ ] 完成 kata 測試練習實作[ ] 繼續閱讀《JavaScript 概念三明治》箭頭函式章節[ ] 練習撰寫測試,驗證函式概念理解學習工具: Vitest + Airbnb JavaScript Style Guide 參考文獻: 《單元測試的藝術》3/e、《JavaScript 概念三明治》

## Publication Information

- [雞蛋糕的前端修煉屋](https://paragraph.com/@gcake/): Publication homepage
- [All Posts](https://paragraph.com/@gcake/): More posts from this publication
- [RSS Feed](https://api.paragraph.com/blogs/rss/@gcake): Subscribe to updates