Combine Functions into Class

練習用的 REPL

// 這是 reading 的資料結構
reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const aReading = acquireReading();
const baseCharge = baseRate(aReading.month, aReading.year) * aReading.quantity;

// Client 2
const aReading = acquireReading();
const base = (baseRate(aReading.month, aReading.year) * aReading.quantity);
const taxableCharge = Math.max(0, base - taxThreshold(aReading.year));

// Client 3
const aReading = acquireReading();
const basicChargeAmount = calculateBaseCharge(aReading);

function calculateBaseCharge(aReading) {
  return baseRate(aReading.month, aReading.year) * aReading.quantity;
}

把資料封裝成一個 class，為了之後可以加上 function。

class Reading {
    constructor(data) {
        this._customer = data.customer;
        this._quantity = data.quantity;
        this._month = data.month;
        this._year = data.year;
    }
    get customer() { return this._customer; }
    get quantity() { return this._quantity; }
    get month()    { return this._month; }
    get year()     { return this._year; }
}

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const aReading = acquireReading();
const baseCharge = baseRate(aReading.month, aReading.year) * aReading.quantity;

// Client 2
const aReading = acquireReading();
const base = (baseRate(aReading.month, aReading.year) * aReading.quantity);
const taxableCharge = Math.max(0, base - taxThreshold(aReading.year));

// // Client 3
// const aReading = acquireReading();
// const basicChargeAmount = calculateBaseCharge(aReading);

function calculateBaseCharge(aReading) {
  return baseRate(aReading.month, aReading.year) * aReading.quantity;
}

// 先從 Client 3 開始
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = calculateBaseCharge(aReading);

把計算行為搬到新建立的類別去。

class Reading {
    constructor(data) {
        this._customer = data.customer;
        this._quantity = data.quantity;
        this._month = data.month;
        this._year = data.year;
    }
    get customer() { return this._customer; }
    get quantity() { return this._quantity; }
    get month()    { return this._month; }
    get year()     { return this._year; }
    // get calculateBaseCharge() {
    //     return baseRate(this.month, this.year) * this.quantity;
    // }
    get baseCharge() {      // 搬過來後，改名字
        return baseRate(this.month, this.year) * this.quantity;
    }
}

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const aReading = acquireReading();
const baseCharge = baseRate(aReading.month, aReading.year) * aReading.quantity;

// Client 2
const aReading = acquireReading();
const base = (baseRate(aReading.month, aReading.year) * aReading.quantity);
const taxableCharge = Math.max(0, base - taxThreshold(aReading.year));

// Client 3
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = aReading.baseCharge; // 改用 class 內的 get 方法

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const baseCharge = aReading.baseRate;      // 然後把 client 1 的呼叫也換掉

// Client 2
const aReading = acquireReading();
const base = (baseRate(aReading.month, aReading.year) * aReading.quantity);
const taxableCharge = Math.max(0, base - taxThreshold(aReading.year));

// Client 3
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = aReading.baseCharge;

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const baseCharge = aReading.baseRate;

// Client 2
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
// const base = (baseRate(aReading.month, aReading.year) * aReading.quantity);        // 這邊顯然也可以拿掉
const taxableCharge = Math.max(0, aReading.baseCharge - taxThreshold(aReading.year)); // 改由直接呼叫 class 的 get 方法

// Client 3
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = aReading.baseCharge;

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};

// Client 1
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const baseCharge = aReading.baseRate;

// Client 2
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const taxableCharge = Math.max(0, aReading.baseCharge - taxThreshold(aReading.year));

// Client 3
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = aReading.baseCharge;

class Reading {
    constructor(data) {
        this._customer = data.customer;
        this._quantity = data.quantity;
        this._month = data.month;
        this._year = data.year;
    }
    get customer() { return this._customer; }
    get quantity() { return this._quantity; }
    get month()    { return this._month; }
    get year()     { return this._year; }
    get baseCharge() {
        return baseRate(this.month, this.year) * this.quantity;
    }
    get taxableCharge() {                   // 再把計算抽到 class 內
        return  Math.max(0, this.baseCharge - taxThreshold(this.year));
    }
}

reading = {customer: "ivan", quantity: 10, month: 5, year: 2017};


// Client 1
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const baseCharge = aReading.baseRate;

// Client 2
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
// 然後改掉呼叫方法
const taxableCharge = aReading.taxableCharge;

// Client 3
const rawReading = acquireReading();
const aReading = new Reading(rawReading);
const basicChargeAmount = aReading.baseCharge;

class Reading {
    constructor(data) {
        this._customer = data.customer;
        this._quantity = data.quantity;
        this._month = data.month;
        this._year = data.year;
    }
    get customer() { return this._customer; }
    get quantity() { return this._quantity; }
    get month()    { return this._month; }
    get year()     { return this._year; }
    get baseCharge() {
        return baseRate(this.month, this.year) * this.quantity;
    }
    get taxableCharge() {                   // 再把計算抽到 class 內
        return  Math.max(0, this.baseCharge - taxThreshold(this.year));
    }
}