---
# System prepended metadata

title: 四則運算
tags: [JS 直播班 - 2023 秋季班]

---

---
tags: JS 直播班 - 2023 秋季班
---
# 四則運算

>若有任何疑問請至 Discord「作業討論」頻道討論

## 本章節要學什麼？
學習練習使用基礎的四則運算來熟悉加減乘除與重構簡單的計算元件。

## 題目1：相加產生器 (+)
``` =JavaScript
// input 輸入
add(1,1);
add(2,2);
add(3,3);

// output 輸出
2
4
6
```


## 題目2：相減產生器 (-)
``` =JavaScript
// input 輸入
subtract(1,1);
subtract(2,3);
subtract(8,3);

// output 輸出
0
-1
5
```
## 題目3：相乘三次 (*)

* 輸入一個數字後，該參數會相乘 3 次，例如輸入 `2`，輸出為 `2*2*2=8`

``` =JavaScript
// input 輸入
multiply3Times(3);
multiply3Times(0);
multiply3Times(9);

// output 輸出
27
0
729
```

## 題目4：取 2 的餘數（%）
``` =JavaScript
// input 輸入
remainder(3);
remainder(2);
remainder(8);

// output 輸出
1
0
0
```

## 題目5：取 2 的餘數 + 判斷是否可整除 (% + 結果判斷)

``` =JavaScript
// input 輸入
isDivisible(3);
isDivisible(2);
isDivisible(8);

// output 輸出
未整除
已整除
已整除
```

## 題目6：我要存錢(區域變數、全域變數)
請透過 `addBankMoney` 函式，來累加 `bankMoney` 變數
```=JavaScript
let bankMoney = 0;

<!-- 作答開始  -->
function addBankMoney(num){
  
}
<!-- 作答結束  -->

// input 輸入
addBankMoney(1);
addBankMoney(50);
addBankMoney(10);

// output 輸出
bankMoney 值為 1
bankMoney 值為 51
bankMoney 值為 61
```

## 題目7：簡單計算機
```=javascript
// input 輸入
calculate(3,5,'+');
calculate(4,2,'-');
calculate(7,9,'*');
calculate(5,5,'/');

// output 輸出
8
2
63
1
```
## 題目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"
```
## 題目9：商業邏輯題：增加服務費
六角冰果店即將開張，但發現收銀機漏寫服務費邏輯，還請協助撰寫：
* 一個 `serviceCharge`函式，來計算 5% 服務費並回傳總計費用為多少。

情境：小華吃了一碗冰，小計 100 元，加上服務費為 105 元。

```=javascript
<!-- 作答開始 -->
function serviceCharge(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;
}

```


## 作業提交等級

* LV1：解出 10 題，並提交 Codepen
* LV2：設計一個 hackmd，嘗試自己設計 10 題
* LV3：嘗試去做其他學生寫的題目，並 tag 學員回報給他，感謝他的命題，讓自己觀念更好

<!-- 參考解答： 
https://codepen.io/jmimiding4104/pen/QWzaWPM

這邊解答可能不都是最佳的解法，
適合初學者或者該題突然卡住者，
內容程式碼有針對內容進一步註解可供參考。

-->

## 回報區


|     Discord      |                                   LV1 答案                                   |                    LV2 自行設計題目                     |                           LV3 做其他學員設計的題目                           |
|:----------------:|:----------------------------------------------------------------------------:|:-------------------------------------------------------:|:----------------------------------------------------------------------------:|
|     ShangChu     |            [Codepen](https://codepen.io/shangchu0412/pen/mdaaQLN)            |                                                         |                                                                              |
|     Moreene      |              [CodePen](https://codepen.io/Moreene/pen/rNoooxZ)               |                                                         |                                                                              |
|     Chia Pin     |             [CodePen](https://codepen.io/joker-cat/pen/PoXXXKW)              |                                                         |                                                                              |
|       精靈       | [Codepen](https://codepen.io/vesbexih-the-bashful/pen/MWZZZQP?editors=0012)  |                                                         |                                                                              |
|      詹姆士      |              [CodePen](https://codepen.io/z111048/pen/bGOOzdj)               |                                                         |                                                                              |
|     LinaChen     |              [CodePen](https://codepen.io/LinaChen/pen/eYbbbYr)              |                                                         |                                                                              |
|     Zhu.lin      |           [CodePen](https://codepen.io/codepenplayer/pen/rNooPoL)            |                                                         |                                                                              |
|     ming0712     |            [CodePen](https://codepen.io/StevenHuang/pen/rNooPqL)             |                                                         |                                                                              |
|     pinyi_9      |         [CodePen](https://codepen.io/Wpypy/pen/gOZZqMv?editors=1112)         |                                                         |                                                                              |
|     Ataraxia     |            [CodePen](https://codepen.io/ataraxia8888/pen/RwEEdpv)            |                                                         |          [謝謝 TTedd, Rxzan, MDFK 同學出題 🙏](https://codepen.io/ataraxia8888/pen/RwEEdpv)                                                                    |
|      shiro       |           [CodePen](https://codepen.io/chenghsienwang/pen/GRPPLrq)           |                                                         |                                                                              |
|        MY        |        [CodePen](https://codepen.io/ahmomoz/pen/ExGGMoQ?editors=0110)        |                                                         |                                                                              |
|    tanuki5863    |       [CodePen](https://codepen.io/tanuki320/pen/WNLLPKB?editors=1011)       |                                                         |                                                                              |
|      jiayu       | [CodePen](https://codepen.io/fjqxaznl-the-reactor/pen/GRPPLzm?editors=0011)  |                                                         |                                                                              |
|    Celine 510    |             [CodePen](https://codepen.io/Celine-510/pen/dywwEMN)             |                                                         |                                                                              |
|     ann6212      | [CodePen](https://codepen.io/yqmegupa-the-styleful/pen/mdaaQvd?editors=1012) |                                                         |                                                                              |
|      Tina02      |        [CodePen](https://codepen.io/chjitlox-the-bashful/pen/VwqqOdr)        |                                                         |                                                                              |
|       Suzi       |       [CodePen](https://codepen.io/midomommy/pen/rNoogdx?editors=0010)       |                                                         |                                                                              |
|      shuuu       | [CodePen](https://codepen.io/afjrvjzl-the-bashful/pen/VwqqOVQ?editors=0111)  |                                                         |                                                                              |
|   celinelinnn    |            [CodePen](https://codepen.io/celinephoebe/pen/qBLLGaa)            |                                                         |                                                                              |
|       Zem        |               [CodePen](https://codepen.io/Potoro/pen/ExGraEJ)               |                                                         |                                                                              |
|       SHUO       | [Codepen](https://codepen.io/xrzarxkl-the-reactor/pen/abPXzxo?editors=1011)  |                                                         |                                                                              |
|    santu0868     |             [Codepen](https://codepen.io/HatsumiSan/pen/VwqgvrV)             |                                                         |                                                                              |
|      TTedd       |         [Codepen](https://codepen.io/TTedd/pen/PoXXgNz?editors=0112)         | [HackMD](https://hackmd.io/aLiLKyi7R16bao_gdUGlmQ?view) |        [感謝 Rxzan 大大出題！](https://codepen.io/TTedd/pen/zYybwOb)         |
|       yin        |             [Codepen](https://codepen.io/andy888jam/pen/zYyerXV)             |                                                         |                                                                              |
|      Winnie      |   [Codepen](https://codepen.io/codepen-io-winnie/pen/XWoOXPG?editors=0012)   |                                                         |                                                                              |
|      Mattie      |       [CodePen](https://codepen.io/mattielin/pen/zYyeYVa?editors=0010)       |                                                         |                                                                              |
| 浪裡小白龍#6860  |        [CodePen](https://codepen.io/Emillo/pen/JjwxGaP?editors=0011)         |                                                         |                                                                              |
|     kuanju27     |             [CodePen](https://codepen.io/Eero-Chiao/pen/ZEVVmxJ)             |                                                         |                                                                              |
|       保羅       |       [CodePen](https://codepen.io/paul-1997/pen/OJrdmRQ?editors=1011)       |                                                         |                                                                              |
|     hsu0921      |            [CodePen](https://codepen.io/HSUANIN0327/pen/QWzYvGJ)             |                                                         |            [CodePen](https://codepen.io/HSUANIN0327/pen/RwEvVdy)             |
|       Peng       |               [CodePen](https://codepen.io/H-Peng/pen/QWzYvKZ)               |                                                         |                                                                              |
|       Oria       |        [CodePen](https://codepen.io/kajing/pen/poqGwpE?editors=1111)         |                                                         |                                                                              |
|     Morning      | [CodePen](https://codepen.io/sxzjnkxs-the-styleful/pen/Jjwweam?editors=0112) |                                                         | [Codepen](https://codepen.io/sxzjnkxs-the-styleful/pen/OJrdgZL?editors=0011) |
|       阿榮       |      [Codepen](https://codepen.io/codeitaday/pen/abPXwNy?editors=0011)       |                                                         |      [Codepen](https://codepen.io/codeitaday/pen/abPXwYq?editors=0011)       |
|  奔跑吧(GTR150)  |        [Codepen](https://codepen.io/Wer-Qwe/pen/qBLgjEP?editors=1111)        |                                                         |                                                                              |
|       Dora       |        [Codepen](https://codepen.io/dorayu/pen/dywaYbm?editors=1011)         |                                                         |                                                                              |
|  xiaokui_71292   |              [Codepen](https://codepen.io/pen?template=eYbxeMR)              |                                                         |                                                                              |
|     smalljie     |              [Codepen](https://codepen.io/smalljie/pen/MWZLrWE)              |                                                         |                                                                              |
|       一畫       |   [Codepen](https://codepen.io/YH-K-the-selector/pen/dywadKR?editors=0012)   |                                                         |                                                                              |
| fionachiang_2023 |            [Codepen](https://codepen.io/fionachiang/pen/bGOzKXZ)             |                                                         |                                                                              |
|    yijing0502    |          [Codepen](https://codepen.io/Yi-Jing-71080635/pen/VwqgXPd)          |                                                         |                                                                              |
|      Rxzan       |      [Codepen](https://codepen.io/Tzuru-Chen/pen/ZEVwOKL?editors=1011)       |     [HackMD](https://hackmd.io/@Tcadmin/HylMdlQZ6)      |             [感謝 TTedd 大大用心出題！🙏](https://codepen.io/Tzuru-Chen/pen/yLGZGBX)             |
|     neo_1104     |       [Codepen](https://codepen.io/eipakoeq-the-animator/pen/ZEVPzad)        |                                                         |                                                                              |
|      Ching       |       [Codepen](https://codepen.io/tzuchingg/pen/vYvPBod?editors=0012)       |                                                         |                                                                              |
|     ss585801     |              [Codepen](https://codepen.io/ss585801/pen/oNJmaMW)              |                                                         |                                                                              |
|    RX00#5351     | [Codepen](https://codepen.io/llqzknqv-the-styleful/pen/PoXLoOg?editors=0010) |                                                         |                                                                              |
|       蛋塔       |      [Codepen](https://codepen.io/Hong-Game1/pen/qBLvdZd?editors=1111)       |                                                         |                                                                              |
|    Joy_chiang    |   [Codepen](https://codepen.io/fwysphbw-the-vuer/pen/yLGwyyX?editors=0012)   |                                                         |                                                                              |
|     ChrisSQR     |              [Codepen](https://codepen.io/ChrisSQR/pen/PoXLwEz)              |                                                         |                                                                              |
|       小廷       |       [Codepen](https://codepen.io/uyxkiake-the-selector/pen/qBLgLxG)        |                                                         |                                                                              |
|    runweiting    |             [Codepen](https://codepen.io/weiting14/pen/RwEdwVY)              |                                                         |                                                                              |
|    markchen_     |      [Codepen](https://codepen.io/Mark-JJchen/pen/JjwzEXN?editors=0011)      |                                                         |                                                                              |
|       Jun_       |               [Codepen](https://codepen.io/Jun-L/pen/QWzYVjp)                |                                                         |                                                                              |
|  skypassion5000  |    [Codepen](https://codepen.io/skypassion5000/pen/MWZxmOx?editors=0011)     |                                                         |                                                                              |
|      Allen       |               [Codepen](https://codepen.io/hlctw/pen/MWZLPod)                |                                                         |                                                                              |
|     skylaaaa     |             [Codepen](https://codepen.io/chihyu2790/pen/poqYwGE)             |                                                         |                                                                              |
|     Ivy             |  [Codepen](https://codepen.io/Irene-Ke/pen/PoXLKvW?editors=0010)          |                      |                        |
|     minnielin     |            [Codepen](https://codepen.io/ShengXin-Lin/pen/KKbEarz?editors=1111)            |                                                         | 
|     阿維#2569     |            [Codepen](https://codepen.io/iijojpli-the-looper/pen/YzdgPWo?editors=0111)            |                                                         | 
|白夜|[Codepen](https://codepen.io/Wei903/pen/dywrWXG?editors=1112)|
| yuan! | [CodePen](https://codepen.io/townyuan/pen/VwqRgba) |  | [感謝TTedd出題](https://codepen.io/townyuan/pen/eYboREp), [感謝Rxzan出題](https://codepen.io/townyuan/pen/zYyXzXw) |
| patrickpie | [CodePen](https://codepen.io/patrickpie/pen/jOXJJLN?editors=0010) |  |  |
| ⭐️小正 | [CodePen](https://codepen.io/colorgolden/pen/dywrpay) |
| Fabio20 | [CodePen](https://codepen.io/fabio7621/pen/yLGwORd?editors=1111) |
| phyllis_0802 | [CodePen](https://codepen.io/Phyllis-Cheng/pen/ZEVPJar) |  |  |
| MDFK |[Codepen](https://codepen.io/maywang/pen/Bavbvaa?editors=0012)| [HackMD](https://hackmd.io/@gpwzoBhzQVK9uS394vzV_Q/HJroCJDZ6) | [感謝TTedd出題](https://codepen.io/maywang/pen/YzdMZLb), [自己出題](https://codepen.io/maywang/pen/XWoQyqK?editors=1112),[感謝Rxzan出題](https://codepen.io/maywang/pen/ZEwEvOV?editors=0012)| |
| Befun | [CodePen](https://codepen.io/richard260572/pen/MWZxNMG?editors=1111) |  |  |
| Ivan | [CodePen](https://codepen.io/swalok/pen/RwEOPvg?editors=0012) |  |  |
| MKLee | [CodePen](https://codepen.io/Code-My/pen/YzdMyGE) |  |  |
| xuan | [CodePen](https://codepen.io/xuan0915/pen/XWoQREw?editors=0012)|  |  |
| Peggy | [CodePen](https://codepen.io/peggylai/pen/gOZyxEa?editors=0010) |  |  |
| lemonmolly | [CodePen](https://codepen.io/lemonmolly/pen/jOXRvrW?editors=1112) |  |  |
| shcopy | [CodePen](https://codepen.io/shcopy/pen/oNJOOoa) |  |  |
| Iris | [CodePen](https://codepen.io/iris831206/pen/vYvMMRM?editors=1112) |  |  |
| nini1202desu | [CodePen](https://codepen.io/tvxq5206/pen/abPxoEo?editors=0011) |  |  |
| Uli | [CodePen](https://codepen.io/uli1313/pen/zYyXgYw?editors=0012) |  |  |
| JUNEW | [CodePen](https://codepen.io/June-W/pen/GRPapXG) |  |  |
| 小夏 | [CodePen](https://codepen.io/michaelhsia/pen/YzddBVr) |  |  |
| JasonFu | [CodePen](https://codepen.io/jie-Fu/pen/poqGrXx) |  |  |
| 楓仔 | [CodePen](https://codepen.io/maplestartend/pen/PoXvByB?editors=0012) |  |  |
| Alyce | [CodePen](https://codepen.io/alycehwy/pen/WNLBKVB?editors=0010) |  |  |
| xin | [CodePen](https://codepen.io/Estherrrrrr999/pen/QWzRbqa) |  |  |
| Aritan | [CodePen](https://codepen.io/Aritan/pen/NWeVOGb?editors=0011) |  |  |
| 維哲 | [CodePen](https://codepen.io/kwz1202/pen/NWeZXgZ) |  |  |
| 地球儀 | [CodePen](https://codepen.io/dayday1222/pen/jOXjKVy?editors=0012) |  |  |
| yu.t_liu | [CodePen](https://codepen.io/YuT200053/pen/ZEVdYje?editors=1111) |  |  |
| Lainie1931 | [CodePen](https://codepen.io/Lainie88/pen/PoXLdPY?editors=1012) |  |  |
| Leo | [CodePen](https://codepen.io/Aruminiya/pen/VwqoaVo) |  |  |
| zona | [CodePen](https://codepen.io/w242920/pen/OJrKNML?editors=1111) |  |  |
| lockon | [CodePen](https://codepen.io/Lockon-Stratos/pen/KKbOOQj) |  |  |
| yuan2781 | [CodePen](https://codepen.io/ismebir/pen/RwvbZoZ) |  |  |
| 辣椒 | [Codepen](https://codepen.io/chilichen118/pen/VwgZMex) ||
| rickTsaiii | [Codepen](https://codepen.io/ricktsaiii/pen/XWooQMy) ||
| 郭芙蘭#6374 | [Codepen](https://codepen.io/flora_Kuo/pen/yLZLBaY?editors=1011) |
| 風羽 | [CodePen](https://codepen.io/Joy-Huang/pen/PoXrqxb?editors=1012) |  |  |
| Kouta | [CodePen](https://codepen.io/kouta-f2e/pen/ExraoVr) |  |  |
| damon0323 | [CodePen](https://codepen.io/swk9eny2/pen/WNPbzPp) |  |  |
| Andy | [CodePen](https://codepen.io/andy31342/pen/yLZYLEa?editors=0110) |  |  |
| samgu666 | [CodePen](https://codepen.io/orz311013/pen/jOdbOJM) |  |  |
| cest_jessie | [CodePen](https://codepen.io/itsjessiechen/pen/gOqroWy) |  |  |
| kawa | [CodePen](https://codepen.io/z83xji6/pen/eYxpOqp) |
| gebyman | [CodePen](https://codepen.io/gebyman/pen/JjwVoKZ?editors=0011) |
| lychee_kk | [CodePen](https://codepen.io/kakakala/pen/bGzwKMp?editors=1010) |  |  |
|yaoling.liang|[CodePen](https://codepen.io/Yao-Ling-L-/pen/rNoXVWY?editors=0012)|||
| yuling | [CodePen](https://codepen.io/igzdflpu/pen/gOqWbNG?editors=0011) |  |  |
| sponge | [CodePen](https://codepen.io/biunpujm-the-flexboxer/pen/vYbmRaP?editors=1112) |  |  |
| .ztion | [CodePen](https://codepen.io/ztion/pen/RwvJLyQ?editors=1011) |  |  |
| bf_tsai | [CodePen](https://codepen.io/BF-Tsai/pen/VwgGmYY?editors=0011) |  |  |
| hoyiiiii | [CodePen](https://codepen.io/hoyii/pen/raBeEBa?editors=0012) |  |  |
<!-- 快速複製
 
| 名稱 | [CodePen]() |  |  |

-->