您的瀏覽器不支援JavaScript功能,若網頁功能無法正常使用時,請開啟瀏覽器JavaScript狀態
Antfire 的生活雜記
Skip
    • 首頁
    • Blog
    • 重構心法之陳述句滑動術(Slide...

    重構心法之陳述句滑動術(Slide Statements)

    動機

    為什麼要把陳述句搬家呢?因為把這些相關的事物聚集到一起,會讓程式碼更容易閱讀。
    很多人(包含帥哥我自己)習慣將變數通通宣告在函式的開頭處,甚至還幫它弄一個函式宣告區。
    當這個函式的程式碼越來越長的時候,程式碼看到某一個地方,要回過頭尋找變數宣告的地方會很麻煩,等於是中斷你的閱讀了;或者是要進行重構的時候,把相關的變數宣告挪到第一次呼叫之前,會讓作業更順利。

    手術流程

    1. 找出程式碼片段要搬移的標的,然後測試陳述式在原始位置跟標的位置有沒有存在干涉效應,如果有發現干涉的話,放棄手術。
    2. 剪下程式碼片段貼到標的位置
    3. 測試

    範例

    進行手術的時候,包含兩個決策:找出想移動的程式碼片段以及這些片段適不適合進行手術

    const pricingPlan = retrievePricingPlan();
    const order = retrieveOrder();
    const baseCharge = pricingPlan.base;
    let charge;
    const chargePerUnit = pricingPlan.unit;
    const units = order.units;
    const chargePerUnit = pricingPlan.unit;
    const units = order.units;
    let discount;
    charge = baseCharge + units *  chargePerUnit;
    let discountableUnits = Math.max(units - pricingPlan.discountThreshold, 0);
    discount = discountableUnits * pricingPlan.discountFactor;
    if (order.isRepeat) discount += 20;
    charge = charge - discount;
    chargeOrder(charge);

    以上面的範例為例,前七行是變數的宣告,這個相對容易移動。例如將第七行let count移動到第十行discount = ...不會有問題。

     Comments