###### tags: `2021直播班任務`
# 第四堂：函式設計之術
* [BMI Kata 武道大會](https://forms.gle/Bij2WQZWTnDnW8TB6)
## function 寫法教學 - 設定指令
- 以一天會做的行為當作例子
- 參數寫法介紹
- 加法器
- return 寫法介紹
- let 宣告
- return 多個範例
## if 與 function 的差別
- 直接寫 if 的話，.js 裡只會執行一次
- 寫 function 的話，可以依照自己需求，執行多次執行指令
## input output 練習
* [示意流程圖](https://whimsical.com/RTJhrsaGwpZ8NbXvQjutB7)
### 題目列表
**字串相加**
``` javascript
//input
talk("早上好");
talk("晚上好");
// output
console.log("hi，早上好");
console.log("hi，晚上好");
```
**數字處理**
``` javascript
let data = 0;
//input
count(2);
count(3);
count(5);
// output
console.log(2);
console.log(5);
console.log(10);
```
**數字 return**
``` javascript
//input
let a = count(2); // 4
let b = count(3); // 9
let c = count(5); //25
```
**兩位數四舍五入**
``` javascript
let a = twoFixed(1.8888) // 1.89
let b = twoFixed(3.1234) // 3.13
```
**BMI**
``` javascript
let bmi = calcBmi(178,69) // output:21.78
```
**檢查是否需要帶雨具+if**
``` JavaScript
let a = checkWeater("雨天"); // 要帶雨具
let b = checkWeater("晴天"); //不用帶雨具
```
**增加陣列資料**
``` JavaScript
let data = [];
add("hello");
add("你好嗎？");
// data output ["hello","你好嗎？"]
```
**增加陣列物件資料**
``` JavaScript
let data = [];
add("洧杰","男生");
add("葉子","女生");
// data output [{name:"洧杰",sex:"男生"},{name:"葉子",sex:"女生"}]
```
**取物件資料**
``` JavaScript
const bmiStatesData = {
"overThin": {
"state": "過輕",
"color": "藍色"
},
"normal": {
"state": "正常",
"color": "紅色"
}
}
checkBmiStates("overThin"); //你的體重過輕，指數為藍色
checkBmiStates("normal"); //你的體重正常，指數為紅色
```
## 抽獎
``` JavaScript
function getRandom(x){
return Math.floor(Math.random()*x);
};
//https://ithelp.ithome.com.tw/articles/10197904
```
## 第四關主線任務 BMI Kata
* <a href="https://rpg.hexschool.com/training/17/task?type=detail&id=171" target="_top">第四關主線任務</a>
達求職門檻工程師水準等級為 10 分鐘，每日練一遍當起手式，3/8 開始到 3/19 每天早上 9:05 發 Slack 訊息，張貼自己的練功情況
150 點積分
作業資源：
👉 此任務僅授權提供『JS直播春季班』學員 👈
繳交內容需含以下三點
請依照以下練功題目練十遍，填寫此 Google 表單
您的 Slack 暱稱
作業網址：請依照透過 Codepen 或 GitHub Pages 提交作業，以方便助教與講師檢視
練功題目：BMI Kata
請依照影片內容與 excel BMI 規則、流程圖，依照以下三階段來練習此題目。
第一階段：請寫 printBmi 函式，並印出對應狀態
printBmi(178, 20) >> 印出 console.log 文字為「您的體重過輕」
printBmi(178, 70) >> 印出 console.log 文字為「您的體重正常」
printBmi(178, 85)>> 印出 console.log 文字為「您的體重過重」
printBmi(178, 90)>> 印出 console.log 文字為「您的體重輕度肥胖」
printBmi(178, 110)>> 印出 console.log 文字為「您的體重中度肥胖」
printBmi(178, 130)>> 印出 console.log 文字為「您的體重重度肥胖」
printBmi("身高","體重")>> 印出 console.log 文字為「您的數值輸入錯誤，請重新輸入」
第二階段：請程式碼裡加入此變數，並嘗試運用此變數裡的資訊。
printBmi(178, 20) >> 印出 console.log 文字為「您的體重過輕，健康指數為藍色」
printBmi(178, 70) >> 印出 console.log 文字為「您的體重正常，健康指數為紅色」
printBmi(178, 85)>> 印出 console.log 文字為「您的體重過重，健康指數為澄色」
printBmi(178, 90)>> 印出 console.log 文字為「您的體重輕度肥胖，健康指數為黃色」
printBmi(178, 110)>> 印出 console.log 文字為「您的體重中度肥胖，健康指數為黑色」
printBmi(178, 130)>> 印出 console.log 文字為「您的體重重度肥胖，健康指數為綠色」
printBmi("身高","體重")>> 印出 console.log 文字為「您的數值輸入錯誤，請重新輸入」
第三階段：儲存每筆計算資料，多一個變數為 bmiHistoryData，並賦予空陣列來儲存計算物件資料，若數值輸入錯誤，則不儲存。
printBmi(178, 20) >> 印出 console.log 文字為「您的體重過輕，健康指數為藍色」
printBmi(178, 70) >> 印出 console.log 文字為「您的體重正常，健康指數為紅色」
printBmi(178, 85)>> 印出 console.log 文字為「您的體重過重，健康指數為澄色」
showHistoryData() >> 印出 console.log 文字為「您總共計算 3 次 BMI 紀錄，最後一次 BMI 指數為 26.83，體重過重！健康指數為澄色！」
常見QA
Q：一定要做到第三階段，才能提交作業嗎？
A：對的
Q：我對題目不太懂，有解答嗎？
A：有的，請依照此影片的三階段影片，跟著做十遍
Q：我可以優化程式碼嗎？
A：可以，但各階段的指示要做到，例如
第一階段要寫 printBMI 函式
第二階段要運用到該bmiStatesData 變數
第三階段要新增 bmiHistoryData 變數儲存計算資訊
Q：要多快才有達工程師門檻？
A：洧杰：「覺得要壓在 10min 內」
Sign in with Wallet
Connect another wallet