--- title: JS直播班練習 - 四則運算 tags: 四則運算, description: --- 練習 四則運算 === ## 本章節要學什麼? 學習練習使用基礎的四則運算來熟悉加減乘除與重構簡單的計算元件。 ## 題目1:相加產生器 (+) ``` =JavaScript // input 輸入 add(1,1); add(2,2); add(3,3); // output 輸出 2 4 6 ``` ```javascript= function add(num1, num2) { return num1 + num2; }; console.log(add(1, 1)); console.log(add(2, 2)); console.log(add(3, 3)); ``` ## 題目2:相減產生器 (-) ``` =JavaScript // input 輸入 subtract(1,1); subtract(2,3); subtract(8,3); // output 輸出 0 -1 5 ``` ```javascript= function subtract(num1, num2) { return num1 - num2; } console.log(subtract(1, 1)); console.log(subtract(2, 3)); console.log(subtract(8, 3)); ``` ## 題目3:相乘三次 (*) * 輸入一個數字後,該參數會相乘 3 次,例如輸入 `2`,輸出為 `2*2*2=8` ``` =JavaScript // input 輸入 multiply3Times(3); multiply3Times(0); multiply3Times(9); // output 輸出 27 0 729 ``` ```javascript= function multiply3Time(num) { return Math.pow(num, 3); } console.log(multiply3Time(3)); console.log(multiply3Time(0)); console.log(multiply3Time(9)); ``` ## 題目4:取 2 的餘數(%) ``` =JavaScript // input 輸入 remainder(3); remainder(2); remainder(8); // output 輸出 1 0 0 ``` ```javascript= function remainder(num) { return num % 2; } console.log(remainder(3)); console.log(remainder(2)); console.log(remainder(8)); ``` ## 題目5:取 2 的餘數 + 判斷是否可整除 (% + 結果判斷) ``` =JavaScript // input 輸入 isDivisible(3); isDivisible(2); isDivisible(8); // output 輸出 未整除 已整除 已整除 ``` ```javascript= function isDivisible(num) { return num % 2 ? '未整除' : '已整除'; } console.log(isDivisible(3)); console.log(isDivisible(2)); console.log(isDivisible(8)); ``` ## 題目6:我要存錢(區域變數、全域變數) 請透過 `addBankMoney` 函式,來累加 `bankMoney` 變數 ```=JavaScript let bankMoney = 0; <!-- 作答開始 --> function addBankMoney(num){ } <!-- 作答結束 --> // input 輸入 addBankMoney(1); addBankMoney(50); addBankMoney(10); // output 輸出 bankMoney 值為 1 bankMoney 值為 51 bankMoney 值為 61 ``` ```javascript= let bankMoney = 0; function addBankMoney(num) { return bankMoney += num; } console.log(addBankMoney(1)); console.log(addBankMoney(50)); console.log(addBankMoney(10)); ``` ## 題目7:簡單計算機 ```=javascript // input 輸入 calculate(3,5,'+'); calculate(4,2,'-'); calculate(7,9,'*'); calculate(5,5,'/'); // output 輸出 8 2 63 1 ``` ```javascript= function calculate(num1, num2, use) { if (use === '+') { return num1 + num2; } else if (use === '-') { return num1 - num2; } else if (use === '*') { return num1 * num2; } else if (use === '/') { return num1 / num2; } else { return '運算選擇錯誤'; } }; console.log(calculate(3,5,'+')); console.log(calculate(4,2,'-')); console.log(calculate(7,9,'*')); console.log(calculate(5,5,'/')); console.log(calculate(5,5,' ')); ``` - 用``switch(){}``的解法 ```javascript= function calculate(num1, num2, operation){ switch(operation){ case '+': return num1 + num2; case '-': return num1 - num2; case '*': return num1 * num2; case '/': return num1 / num2; }; }; ``` - 利用物件屬性的解法 ```javascript= function calculate(a, b, method) { let obj = { "+": a + b, "-": a - b, "*": a * b, "/": a / b } return obj[method] } ``` ## 題目8:簡單計算機 + 顯示算式過程 ```=javascript // input 輸入 calculateProcess(3,5,'+'); calculateProcess(4,2,'-'); calculateProcess(7,9,'*'); calculateProcess(5,5,'/'); // output 輸出 "3+5=8" "4-2=2" "7*9=63" "5/5=1" ``` ```javascript= function calculateProcess(num1, num2, use) { if (use === '+') { return `${num1} + ${num2} = ${num1 + num2}`; } else if (use === '-') { return `${num1} - ${num2} = ${num1 - num2}`; } else if (use === '*') { return `${num1} * ${num2} = ${num1 * num2}`; } else if (use === '/') { return `${num1} / ${num2} = ${num1 / num2}`; } else { return '運算選擇錯誤'; } }; console.log(calculateProcess(3,5,'+')); console.log(calculateProcess(4,2,'-')); console.log(calculateProcess(7,9,'*')); console.log(calculateProcess(5,5,'/')); console.log(calculateProcess(5,5,' ')); ``` ## 題目9:商業邏輯題:增加服務費 六角冰果店即將開張,但發現收銀機漏寫服務費邏輯,還請協助撰寫: * 一個 `serviceCharge`函式,來計算 5% 服務費並回傳總計費用為多少。 情境:小華吃了一碗冰,小計 100 元,加上服務費為 105 元。 ```=javascript <!-- 作答開始 --> function serviceCharge(num){ } <!-- 作答結束 --> const total = serviceCharge(100); console.log(`您總計費用為 ${total}`) ``` ```javascript= function serviceCharge(num) { return num * 0.05 + num; } const total = serviceCharge(100); console.log(`您總計費用為 ${total}`); ``` ## 題目10:重構題:消除重複,抽離變因 六角冰店超賺,於是開了二店為八角冰店,收銀機商業邏輯調整為: 1. 兩家店同時聘請專業執事與女僕,增加服務費為 10% 2. 六角冰店一碗冰 100 元,八角冰店一碗冰 800 元 `sixAngleCalculate`、`eightAngleCalculate` 丟入 `num` 冰碗數量,就可獲得總費用 ### 重構思路 1. 兩個函式裡面的服務費都是一樣的,可以嘗試抽出來成一個新函式 `serviceCharge`,專門來計算兩間店的服務費 - 原解答 ```javascript= // 第一個參數為冰的數量 function sixAngleCalculate(num){ const subTotal = num * 100; const serviceCharge = subTotal * 0.1; const total = subTotal + serviceCharge; return total; } // function eightAngleCalculate(num){ const subTotal = num * 800; const serviceCharge = subTotal * 0.1; const total = subTotal + serviceCharge; return total; } ``` - 重構 ```javascript= function isServiceCharge(subtotal) { let serviceCharge = subtotal * 0.1; return `費用加上服務費共${serviceCharge + subtotal}元`; } function sixAngleCalculate(num) { let subtotal = 100 * num; return isServiceCharge(subtotal); } function eightAngleCalculate(num) { let subtotal = 800 * num; return isServiceCharge(subtotal); } console.log(sixAngleCalculate(1)); console.log(eightAngleCalculate(1)); ```