念念不忘,必有迴響。有一口氣,點一盞燈,有燈就有人。

如何使用 Wallaby 對 Vue 進行 Unit Test ?

如何使用 Wallaby 對 Vue 進行 Unit Test ?

雖然可以使用 Vue CLI 對 Vue 進行 Unit Test,但實務上若真的大量對 ECMAScript 進行 Unit Test,則 CLI 仍不是最有效率方式,而 Wallaby 能即時顯示 Unit Test 的 紅燈綠燈,可大幅增進 Unit Test 開發效率。

Ramda 之 sort()

Ramda 之 sort()

Ramda 分別提供了 3 個與 排序 相關的 Operator:sort()sortBy()sortWith(),我們以實際的範例來練習這 3 個 Operator。

如何使用 Ramda 對 Getter 加以 Point-free ?

如何使用 Ramda 對 Getter 加以 Point-free ?

Vuex 的 Getter,其 State 與 Getter 都是以 Object 傳入,因此特別適合使用 Ramda 的 useWith() 使 Getter 加以 Point-free。

如何使用 Ramda 對兩層 Array 新增 Property ?

如何使用 Ramda 對兩層 Array 新增 Property ?

實務上可能會遇到 API 回傳的 JSON 是兩層 Array,其中 Object 僅包含 Flag,App 必須根據 Flag 值決定要新增的 Property,這種常見的需求該如何使用 Ramda 實現呢 ? 亦可以此範例學到如何一步一步將 Function 重構成 Point-free。

如何直接 Mock API Function ?

如何直接 Mock API Function ?

對 Action 的 Unit Test,網路上看到的教學大都是針對 Axios 做 Mock,由於我們已經將 API Function 獨立成 Module,事實上也可以使用 Jest 直接 Mock API Function。

如何使 Higher Order Function 也 Point-free ?

如何使 Higher Order Function 也 Point-free ?

將傳入 Data 的 Function 加以 Point-free,這在 Ramda 很常見;但若 Data 傳入的目的是產生另外一個 Function,這類 Higher Order Function 該如何 Point-free 呢 ?

如何使用 Ramda 取代 Destructuring ?

如何使用 Ramda 取代 Destructuring ?

ES2015 的 Destructuring 若用在 Function 參數,可直接將 Object 拆解成變數,非常方便;但若 Objct 的層數過深,直接在參數使用 Destructuring,可讀性並不高,而且還會造成 Argument List 過長。

學習 Ramda 使用 Currying 設計 API

學習 Ramda 使用 Currying 設計 API

Currying 是 FP 的招牌菜,僅管了解 Currying 的定義,但似乎還是很難將 Currying 用在實務上;本文藉由 Ramda 的 Operator 設計,從更務實角度學習 Ramda 怎麼發揮 Currying。

Ramda 之 reduce()

Ramda 之 reduce()

reduce() 亦為 FP 代表性的 operator,與 Array.prototype.reduce() 功能相同;唯內建的 reduce() 是以 OOP 掛在 data 上,而 Ramda 的 reduce() 是以 FP 將 data 傳入最後一個參數。

如何對 Vue 的 Filter 進行 Unit Test ?

如何對 Vue 的 Filter 進行 Unit Test ?

若在 Component 使用 Filter,對 Component 進行 Unit Test 時,就必須對 Filter 加以 Mock,同時也討論如何單獨對 Filter 進行 Unit Test。