---
# System prepended metadata

title: JS 每日任務
tags: [JavaScript 每日任務]

---

---
tags: JavaScript 每日任務
---
# JS 每日任務



## 10/03 ~ 10/14 每日任務挑戰列表
[每日任務挑戰列表](https://rpg.hexschool.com/training/32/show?embedhm=ibb_QjDUSkGPrph3odN6lg)

### 10/03 Day1：變數自我介紹
🏅 Day 01 - 變數自我介紹

#### 題目
---
歡迎大家參加這次的 JS 工程師養成直播班，就先來自我介紹一下吧! 
首先請大家替以下的變數適當的命名，並賦予它們值:

>變數 1: 組別
>變數 2: Discord 名稱
>變數 3: 來自哪裡
>變數 4: 目前的職位
>變數 5: 興趣
>變數 6: JS 學習時數


接著透過 `console.log` 輸出以下字串，`「」`中的內容需要**依序**代入上面的變數呈現。

```
大家好，我是第「x」組的「xxx」，很高興認識各位！ 我來自「xx」，目前是一個「xxx」，平常的興趣是「xxx」。 預計之後每天會花「x」小時學習 JavaScript，未來還請多多指教。
```

=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/wvjEEVE)

#### 今天的每日刷題主題「Even or Odd - 偶數或奇數」

   
刷題連結：https://www.codewars.com/kata/53da3dbb4a5168369a0000fe
=>ok

#### 本週刷題任務主題「四則運算」
每週任務連結：https://hackmd.io/lvFWrEseSuWrWs_tX7RuIg
（有任何問題可以到「作業討論」頻道中討論）

=>[已完成](https://codepen.io/mwebwvuq-the-flexboxer/pen/GRddzeo)


### 10/04 Day2：型別與宣告

🏅 Day 02 - 型別與宣告

#### 題目

以下兩題請合併為一份 CodePen 繳交，並透過「註解」進行回答。

##### 問題一
---
以下變數 a, b, c, d, e, f 它們的值、型別各自為何? (請先想想看，不要用 console.log 檢查)

```javascript=
let a = "10" + "10";
let b = "10" * "10";
let c = 10 + "10";
let d = 10 * "10";
let e = 10 - "2";
let f = "10" - "2";
```

請依照以下格式回答

```javascript=
// 問題一
// a = 值, 型別
// b = 值, 型別
```


##### 問題二
---
請問以下題項哪些是有問題的，並說明為什麼。

```js=
// 1
let myName = "jay";

// 2
var _state = true;

// 3
let true = true;

// 4
const 520Pretty = 520;

// 5
const appleNum = 10;
appleNum = 2;

// 6
var ming ='小明';
var ming = '小民';

// 7
const ming = '小明'; 
const ming = '小民'; 

// 8
let ming = '小明';
let ming = '小民'; 

// 9
let ming = '小明';
ming = '小民';

// 10
let $open = "芝麻開門';
```

範例回答格式:
```javascript=
// 問題二
// (2)，因為 blablabla 
// (3)，因為 balabababa 
```



=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/qBYMJNm)

* 今天的每日刷題主題「Basic Mathematical Operations - 基礎運算符號」
=>ok
刷題連結：https://www.codewars.com/kata/57356c55867b9b7a60000bd7
（可以到「刷題交流」論壇中討論）

### 10/05 Day3：小駝峰式命名

🏅 Day 03 - 小駝峰式命名

#### 題目

請試著回答以下問題。
以下題目請合併為一份 CodePen 繳交，並透過「註解」進行回答。

請參考維基百科的 [駝峰式命名法](https://zh.wikipedia.org/wiki/%E9%A7%9D%E5%B3%B0%E5%BC%8F%E5%A4%A7%E5%B0%8F%E5%AF%AB)，試著以 **小駝峰式命名法** 宣告變數。
舉例：
```javascript=
// 房間數量 
let roomNum ;

// 使用者名稱
let userName ; 
```
1. 咖啡價格
2. 貓貓的體重
3. 浴室數量
4. 刪除檔案
5. 最大人數
6. 姓氏
7. 家庭合照


=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/ZEoMmpJ)

#### 今天的每日刷題主題「Thinkful - Logic Drills: Traffic light - 紅綠燈」
=>ok
刷題連結：https://www.codewars.com/kata/58649884a1659ed6cb000072
（可以到「刷題交流」論壇中討論）


### 10/06 Day4：型別陷阱題

🏅 Day 04 - 型別陷阱題

#### 題目
以下題目請合併為一份 CodePen 繳交，並透過「註解」進行回答。

##### 問題
---
以下變數 a, b, c, d 它們的值、型別各自為何？ 
( 請先想想看，不要用 console.log 檢查 ᕙ( ˙-˙ )ᕗ )

```jsx=
let a = true + true ;
let b = false + 123 ;
let c = null + 123 ;
let d = null + '123';
```

範例回答格式：
```javascript=
// a = 值, 型別
// b = 值, 型別
```

=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/RwyYqYN)

#### 今天的每日刷題主題「Remove String Spaces - 移除字串中的空格」
=>done

刷題連結：https://www.codewars.com/kata/57eae20f5500ad98e50002c5
（可以到「刷題交流」論壇中討論）

### 10/07 Day5：賦值運算子與記憶體觀念

🏅 Day 05 - 賦值運算子與記憶體觀念

#### 題目

以下兩題請合併為一份 CodePen 繳交，並透過「註解」進行回答。

##### 問題一
---
了解賦值運算子，並計算出最後 console.log 印出的結果
```javascript=
let a = 1;
let b = 2;
a += 30;
a--;
b - 1;
a -= b;

console.log(a);
console.log(b);
```

##### 問題二
---
請說明以下程式碼最後共有幾個記憶體空間
```javascript=
let a = '3';
let b = 3;
let c = a*b;
a + 1;
```

=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/rNvZodE)

#### 今天的每日刷題主題「The Feast of Many Beasts - 野獸的盛宴」
刷題連結：https://www.codewars.com/kata/5aa736a455f906981800360d
（可以到「刷題交流」論壇中討論）


### 10/10 Day6：比較運算子

🏅 Day 06 - 比較運算子

#### 題目
以下題目請合併為一份 CodePen 繳交，並透過「註解」進行回答。
看完此文章「[比較運算子](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E6%AF%94%E8%BC%83%E9%81%8B%E7%AE%97%E5%AD%90)」的部分，並試著回答以下程式碼 console.log 的結果。

##### 問題
---
```javascript=
let a = 1;
let b = 2;
let c = "1";

// 1. 
console.log(a > b);

// 2.
console.log(a == c);

// 3. 
console.log(a != b);

// 4.
console.log(a !== c);

// 5.
console.log(a >= c);

```


=>已完成:[codepen](
https://codepen.io/mwebwvuq-the-flexboxer/pen/QWxWvyZ)




### 10/11 Day7：邏輯運算子

🏅 Day 07 - 邏輯運算子

#### 題目
請看完此篇文章的「[邏輯運算子](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E9%82%8F%E8%BC%AF%E9%81%8B%E7%AE%97%E5%AD%90)」部分，
並試著回答以下程式碼 a、b、c、d、e 的值。

##### 問題
---
```javascript=
let a = true || false;
let b = 1 && 0;
let c = (4 > 3) && (2 >= 2);
let d = !(4 > 3);
let e = true && (1 > 2);
```
<!-- 解答：  

a: true
b: 0
c: true
d: false
e: false
-->


=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/oNyNogp)

### 10/12 Day8：運算子大雜燴
🏅 Day 08 - 運算子大雜燴

#### 題目

運用 [Day 6](https://hackmd.io/kEiaexWPTgyfULIMJ0zMCg) 及 [Day 7](https://hackmd.io/ZzlCecYGTf2MeHRPjtOrmw) 學到的知識，回答以下的問題吧～

##### 問題
---
```javascript=
// 1. 請問變數 c 的值
let a = 1;
let b = "1";
let c = (a===b) && (a!==b);


// 2. 請問變數 g 的值
let e = '123'; 
let f = 456;
let g = (e+f) === '123456'; 

// 3. 請問變數 j, k 的值 
let h = true;
let i = false;
let j = 1 == h;
let k = h || i;
```

=>複習:[比較運算子](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E6%AF%94%E8%BC%83%E9%81%8B%E7%AE%97%E5%AD%90)

![](https://i.imgur.com/a64rubZ.png)


<!-- 解答：  

1. c: false
2. g: true
3. j: true
   k: true
-->
=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/KKeKyWV)


### 10/13 Day9：if、else if、else 練習一
🏅 Day 09 - if、else if、else 練習一

#### 題目

請看完此篇文章「[if else 陳述式](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_%E9%99%B3%E8%BF%B0%E5%BC%8F)」部分，並試著回答下面問題。

##### 問題
---

請試著寫出以下情境：

範例： 如果我有 100 元，我就吃壽司，沒有就吃超商。
```javascript=
let myWallet = 200;

if(myWallet >= 100) {
 console.log('我要吃壽司');
} else {
 console.log('我吃超商');
}
```


1. 如果下雨我就坐捷運上班，沒有我就騎車上班
```javascript=
let weather = '雨天';

/* 請試著寫出判斷式 */

```

2. 如果 BMI > 24 就超重，18 ~ 24 體重正常，小於 18 過輕。（提示：補上問號部分)
```javascript=
let myBMI = 19;

/* 請試著寫出判斷式 */

if( ??? ) {
  console.log('過重');
} else if( ??? ) {
  console.log('體重正常');
} else {
  console.log('過輕');
}
 
```


<!-- 解答：  

1.
```javascript=
let weather = '雨天';

if(weather === '雨天') {
 console.log('搭捷運上班');
} else {
 console.log('騎車上班');
}
```

2.
```javascript=
let myBMI = 19;

if(myBMI > 24) {
 console.log('過重');
} else if (myBMI <= 24 && myBMI >= 18){
 console.log('體重正常');
} else {
 console.log('過輕');
}
```

-->

=>已完成:[codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/bGKGMYW)

##### 筆記
![](https://i.imgur.com/oJ20VbH.png)


### 10/14 Day10：if、else if、else 練習二

🏅 Day 10 - if、else if、else 練習二

#### 題目

延續 [Day 9](https://hackmd.io/NKf9tfsmQiymV88UaAZ3JQ) 的知識，試著回答下面問題。

##### 問題
---

觀看下方程式碼，試著回答出最後 console.log 會印出什麼：

第一題：
```javascript=
let a = 10;
let b = '10';

if( a >= b ){
 console.log('a 等於 b');
} else {
 console.log('a 不等於 b');
}
```

第二題：
```javascript=
let c = false;

if(!c){
 console.log('六角學院 讚！');
} else {
 console.log('六角學院 讚讚！');
}
```

第三題：

```javascript=
let d = 100;

if(d == '100'){
 console.log('沒錯！');
} else if ( d != '100') {
 console.log ('這陷阱題！');
} else {
 console.log('錯！');
}
```

=>已完成:[CodePen](https://codepen.io/mwebwvuq-the-flexboxer/pen/GRGRdGj) 
<!-- 解答：  

1. 'a 等於 b'
2. '六角學院 讚！'
3. '沒錯！'
-->



## 10/17 ~ 10/28 每日任務挑戰列表

### 10/17 Day11：陣列操作
🏅 Day 11 - 陣列操作

#### 題目
請運用課堂中教到的陣列相關知識，依照下方註解敘述，完成下方程式碼（補上 `...` 的部分）


##### 問題
---
```javascript=
let recipe = ['sugar', 'salt', 'flour', 'fruit'];

// 1. 請使用陣列方法取得 recipe 的長度，並使用 console.log 印出
console.log(...);

// 2. 請使用陣列取值方法取得結果為 'sugar' 的值，並使用 console.log 印出
console.log(...);

// 3. 請使用陣列取值方法取得結果為 'fruit' 的值，並使用 console.log 印出
console.log(...);

// 4. 請使用陣列方法替陣列 recipe 在最後新增一個值 'butter'
recipe...;
            
// 5. 請使用陣列方法刪除陣列 recipe 第 3 筆以後的資料（包含第 3 筆），最後印出整個陣列
recipe...;
console.log(recipe);
```
=>已完成:[CodePen](https://codepen.io/mwebwvuq-the-flexboxer/pen/JjZjZYd)

<!-- 解答： 

// 1. 
console.log(recipe.length);
// 2. 
console.log(recipe[0]);
// 3. 
console.log(recipe[3]);
// 4. 
recipe.push('butter');
// 5.
recipe.splice(2, recipe.length-1);
console.log(recipe);
-->
補充文章 - 「JS 常見陣列方法」：
https://www.casper.tw/development/2020/10/04/js-array-methods/




### 10/18 Day12：陣列操作應用

🏅 Day 12 - 陣列操作應用

#### 題目

高雄地區開始實施兵役體檢，只要符合以下其中一個條件就可以免除兵役:
1. BMI >= 35
2. 天生為扁平足 (Flatfoot)

請透過以下程式幫 Bob 判斷一下他需不需要當兵，如果需要，則用陣列方法把他加到 soldierName 陣列裡面。（補上 `...` 的部分）

```javascript=
let soldierName = ["Tom", "Nick", "John"];
let bobBmi = 22;
let isFlatfoot = false;

if(...) {
  console.log("Bob 不用當兵");
} else {
  // 將 Bob 填入國軍名單
  ...
  console.log("Bob 光榮入伍");
  console.log(`名單: ${soldierName}`);
}
```


<!-- 解答：  

```
let soldierName = ["Tom", "Nick", "John"];
let bobBmi = 22;
let isFlatfoot = false;

if(bobBmi >= 35 || isFlatfoot) {
  console.log("Bob 不用當兵");
} else {
  // 將 Bob 填入國軍名單
  soldierName.push("Bob");
  console.log("Bob 光榮入伍");
  console.log(`名單: ${soldierName}`);
}
```
-->

=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/JjZjZyK)


### 10/19 Day13：物件操作

🏅 Day 13 - 物件操作

#### 題目

以下是製作麵包的食譜，請新增一個名為 breadRecipe 的物件，並依照以下要求設定屬性：

1. 新增一個名為 ingredients 的屬性，其值為一個陣列，包含 ＂高筋麵包粉＂、＂ 牛奶＂、＂酵母＂、＂糖＂、＂鹽＂、＂奶油＂。
2. 新增一個名為 bakeTime 的屬性，其值為 30。
3. 新增一個名為 difficulty 的屬性，其值為 ＂簡單＂。
4. 新增一個名為 seasoning 的屬性，其值為一個物件，包含:
    - 屬性名稱: sugar - 值:＂22g＂
    - 屬性名稱: salt - 值:＂10g＂
    - 屬性名稱: pepper - 值:＂10g＂

```javascript=
let breadRecipe = {
    /*  程式碼撰寫處  */
};
```


<!-- 解答：  

```
let breadRecipe = {
  ingredients: ["高筋麵包粉", "牛奶", "酵母", "糖", "鹽", "奶油"],
  bakeTime: 30,
  difficulty: "簡單",
  seasoning: {
    sugar: "20g",
    salt: "10g",
    pepper: "10g"
  }
};
```
-->

=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/vYrYrpe)


### 10/20 Day14：物件取值
🏅 Day 14 - 物件取值

在物件內新增、修改、取得屬性的方法有以下兩種:

1. 點記法 (Dot notation)

```javascript=
let obj = {};
obj.key = "value";  // 新增或修改
console.log(obj.key); // 取得
```

2. 括弧記法 (Bracket notation)
```javascript=
let obj = {};

// 當屬性的值帶有小數點、空格或是數字時可以使用，記得要加上引號 (單引號或雙引號皆可)
obj['k e y'] = "value";  // 新增或修改
console.log(obj['key']); // 取得
```

#### 題目

請觀看下方程式碼，依照註解敘述完成程式碼（補上 `...` 的部分）：

```javascript=
let weather = {
  country: "高雄",
  "PM2.5": 35,
  isSunny: false,
  rainingRegion: ['鼓山', '鹽埕', '旗津'],
  rainFall: {
    鼓山: 400,
    鹽埕: 300,
  }
} 

// 取得 country 的值，並使用 console.log 印出
console.log(...); 

// 取得 "PM2.5" 的值，並使用 console.log 印出
console.log(...);

// 取得 isSunny 的值，並使用 console.log 印出
console.log(...); 

// 取得 rainingRegion 陣列的第一個值 '鼓山'，並使用 console.log 印出
console.log(...); 

// 在 rainFall 新增一個屬性名為「旗津」、設定值為 200，並，並使用 console.log 印出 rainFall 的值
...
console.log(rainFall);
```


<!-- 解答：  

// 取得 country 的值
console.log(weather.country);  // 方法一
console.log(weather["country"]);  // 方法二


// 取得 "PM2.5" 的值
console.log(weather["PM2.5"]); 


// 取得 isSunny 的值
console.log(weather.isSunny);  // 方法一
console.log(weather["isSunny"]);  // 方法二


// 取得 rainingRegion 陣列的第一個值 '鼓山'
console.log(weather.rainingRegion[0]); 


// 在 rainFall 新增一個屬性名為「旗津」、設定值為 200，並輸出結果
weather.rainFall.旗津 = 200; // 方法一
console.log(weather.rainFall);

weather["rainFall"]["旗津"] = 200; // 方法二
console.log(weather["rainFall"]);
-->

=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/abKbKeJ)


### 10/21 Day15：陣列物件整合操作應用

🏅 Day 15 - 陣列物件整合操作應用

#### 題目

請依照下方程式碼中註解的要求完成這段程式碼（補上 `...` 的部分）：

```javascript=
let productInfo = {
  price: 1000,  // 購買價格
  coupons: [
    {
      due_date: "2022-10-15",  // 到期日
      id: 123,  
      is_enabled: 0,           // 是否啟用
      percent: 0.7,            // 折扣比例
      title: "特惠七折",        // coupon 標題
    },
    {
      due_date: "2022-08-08",  // 到期日
      id: 456,
      is_enabled: 1,           // 是否啟用
      percent: 0.5,            // 折扣比例
      title: "特惠五折",        // coupon 標題
    }
  ]
};

/* 請取得 coupons 陣列中 id 為 456 的 percent，並賦值給 discountPercent */
let discountPercent = ...;

/* 請取得 coupons 陣列中 id 為 456 的 title，並賦值給 title */
let title = ...;

/* 請修改 coupons 陣列中 id 為 456 的 到期日，將其延後兩日（至 2022-08-10）*/
...

/* 請取得 coupons 陣列中 id 為 456 的 is_enabled，並填入以下 if 判斷式中; 
如果判斷為 true，則對「購買價格」進行折扣 */
if(...) {
  /* 程式碼撰寫處，對「購買價格」進行折扣 */
  ...
  console.log(`優惠券「${title}」已啟用`);
} else {
  console.log("優惠券未啟用");
}
console.log(`購買價格 ${productInfo.price}`);
```


<!-- 解答：  

let productInfo = {
  price: 1000,  // 購買價格
  coupons: [
    {
      due_date: "2022-10-15",  // 到期日
      id: 123,  
      is_enabled: 0,           // 是否啟用
      percent: 0.7,            // 折扣比例
      title: "特惠七折",        // coupon 標題
    },
    {
      due_date: "2022-08-08",  // 到期日
      id: 456,
      is_enabled: 1,           // 是否啟用
      percent: 0.5,            // 折扣比例
      title: "特惠五折",        // coupon 標題
    }
  ]
};
let discountPercent = productInfo.coupons[1].percent;
let title = productInfo.coupons[1].title;
productInfo.coupons[1].due_date = "2022-08-10";
if(productInfo.coupons[1].is_enabled) {
  /* 程式碼撰寫處，對「購買價格」進行折扣*/
  productInfo.price *= discountPercent;
  console.log(`優惠券「${title}」已啟用`);
} else {
  console.log("優惠券未啟用");
}
console.log(`購買價格 ${productInfo.price}`);
-->

=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/mdKdjzY)

### 10/24 Day16：函式觀念一

🏅 Day 16 - 函式觀念一

依照下方教學練習，並回答問題。

#### 基本函式寫法教學 
[課程影音連結](https://courses.hexschool.com/courses/202011131/lectures/42391122)

1. 宣告、命名函式
```javascript=
// 在此 morningAction 是自定義的名稱
function morningAction() {
  // 定義函式執行內容
  console.log("刷牙");
  console.log("洗臉");
} 
```
2. 呼叫函式
```javascript=
morningAction();
morningAction();
```
> 1. 函式撰寫完後，需要呼叫才會執行
> 2. 函式可以重複呼叫

##### 問題
---
1. 宣告一個函式，讓此函式執行後會印出字串 `"這是一個函式"`
2. 觀看下方程式碼，最後會印出什麼
```javascript=
function sayHello() {
  console.log("ㄋ好");
}
console.log("Bye！");
```
3. 觀看下方程式碼，選出正確敘述
```javascript=
function sayHi() {
  console.log("Hi");
}
sayHi();
sayHi();

/* 選項 
   1. 函式不能重複呼叫，會報錯
   2. 最後會印出兩個 Hi
   3. 只會執行一次，印出一個 Hi
*/
```


<!-- 解答：  

1. 函式名稱可以隨意命名，盡量與執行內容相符即可
```
function printString() {
  console.log("這是一個函式");
}
printString();  // 記得呼叫才會執行
```

2. Bye！
3. 選項 2
-->
=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/QWxWBPK)

### 10/25 Day17：函式觀念二
🏅 Day 17 - 函式觀念二

依照下方程式碼練習，並回答問題。

#### 函式裡面仍可以執行函式 

[課程影音連結](https://courses.hexschool.com/courses/202011131/lectures/42391124)

```javascript=
function dailyAction() {
  cleanHead();
  console.log("出門");
  console.log("回家");
  cleanHead();
} 
function cleanHead() {
  console.log("刷牙");
  console.log("洗臉");
} 
dailyAction();
```
> 函式內部可以呼叫其他函式，
> 可以重複利用程式碼、簡潔版面。

##### 問題
---
1. 觀看以下程式碼，利用函式觀念二，嘗試優化 `todayTask()` 函式
```javascript=
function todayTask() {
  console.log("觀看課程");
  console.log("製作筆記");
  console.log("每日任務");
  console.log("觀看課程");
  console.log("製作筆記");
  console.log("主線任務");
  console.log("觀看課程");
  console.log("製作筆記");
}
function watchAndNote() {
  console.log("觀看課程");
  console.log("製作筆記");
}
```
2. 觀看以下程式碼，最後會印出什麼
```javascript=
function printNumbers() {
  printOne();
  console.log("11");
  printOne();
}
function printOne() {
  console.log("1");
}
printOne();
```


<!-- 解答：  

1. 
```
function todayTask() {
  watchAndNote();
  console.log("每日任務");
  watchAndNote();
  console.log("主線任務");
  watchAndNote();
}
function watchAndNote() {
  console.log("觀看課程");
  console.log("製作筆記");
}
```

2. 1
   （原因：printNumbers() 沒有呼叫！）
-->

### 10/26 Day18：[函式觀念三]
🏅 Day 18 - 函式觀念三

依照下方程式碼練習，並回答問題。

#### 函式參數觀念 

[課程影音連結](https://courses.hexschool.com/courses/202011131/lectures/42391125)（函式參數介紹、參數寫法）

1. 函式可以帶入自定義的參數（在此為 num1, num2），並在呼叫函式的時候傳入。
```javascript=
function callNum(num1, num2){
  let total = num1 + num2;
  console.log(total);
}
// num1 等於 1, num2 等於 2
callNum(1, 2);
// num1 等於 2, num2 等於 4
callNum(2, 4);
```

2. 參數只存活在大括號。

```javascript=
function callNum(num){
  // 在此可以成功呼叫 num
  console.log(num);
}
callNum(1);
// 函數外部不可以呼叫 num，這行會報錯 
// Uncaught ReferenceError: num is not defined
console.log(num);
```


##### 問題
---
1. 觀看以下程式碼，最後會印出什麼，以及變數 `sum` 最後的值
```javascript=
let sum = 1;
function calcNum(x) {
  sum += x;
  console.log(x);
}
calcNum(3);
```
2. 下方程式碼宣告了一個陣列（陣列內是費波那契數列），請完成下方程式碼（補上 `...` 的部分），讓 `calcNextNum()` 函式可以正常執行，並讓陣列中最後兩個數字相加後 push 到陣列中，最後 `fibonacciArr` 陣列值為 `[1, 1, 2, 3, 5, 8]`
```javascript=
let fibonacciArr = [1, 1, 2, 3, 5];
let fibonacciArrLength = fibonacciArr.length;
function calcNextNum(...) {
  ...
}
calcNextNum(fibonacciArr[fibonacciArrLength-1], fibonacciArr[fibonacciArrLength-2]);
console.log(fibonacciArr);
```



<!-- 解答：  

1. 3, 
   sum: 4

2. 
```javascript=
let fibonacciArr = [1, 1, 2, 3, 5];
let fibonacciArrLength = fibonacciArr.length;
function calcNextNum(last, penultimate) {   // 參數命名可以隨意自訂
  fibonacciArr.push(last+penultimate);
}
calcNextNum(fibonacciArr[fibonacciArrLength-1], fibonacciArr[fibonacciArrLength-2]);
console.log(fibonacciArr);
```
-->


=>已完成:[Codepen](https://codepen.io/mwebwvuq-the-flexboxer/pen/YzvXzra)


### 10/27 Day19：[函式觀念四]

🏅 Day 19 - 函式觀念四

依照下方程式碼練習，並回答問題。

#### 函式的 return 觀念 

[課程影音連結](https://courses.hexschool.com/courses/202011131/lectures/42391129)（return 寫法、return 可以有多個）

１. 函式可以用 return 回傳一個值，並可以將該值賦予給其他變數。
```javascript=
function calcTotalScore(chineseScore, englishScore){
  let total = chineseScore + englishScore;
  return total;
}

// 將 calcTotalScore 的回傳值賦值給 markScore。
let markScore = calcTotalScore(60, 50);
console.log(markScore);
```

2. return 會中斷函式執行，可以有多個 return、搭配 if else 做使用。
```javascript=
function calcTotalScore(chineseScore, englishScore){
  let total = chineseScore + englishScore;
    
  // 在此因為 total > 100，所以在第一個 if 函式就中斷了
  if(total > 100){
    return `總分 ${total}，做的好啊 mark`;
  else{
    return `總分 ${total}，考得不是很好 mark`;
  }

  // 以下的 return 都不會執行
  return chineseScore;
  return englishScore;
}

let markScore = calcTotalScore(60, 50);
console.log(markScore);
```

##### 問題
---
1. 下方敘述何者正確
(1) 一個函式中不能有多個 return
(2) return 的值可以賦予到變數上，像是下方程式碼中變數 `midNum` 最後的值會變為 `2` 

    ```javascript=
    let midNum = 0;
    function calcMidNum(num1,num2) {
      return (num1 + num2) / 2;
    }
    midNum = calcMidNum(1,3);
    ```
2. 觀看下方程式碼，選出正確敘述
```javascript=
let awardMoney = 0
function getAward(score) {
  if(score >= 90) {
    console.log("贏得獎金 100 元");
    return 100;
  } else if(score >= 60) {
    console.log("贏得獎金 50 元");
    return 50;
  } else {
    console.log("再接再厲！");
  }
  console.log("比賽結束！");
}
awardMoney = getAward(85);
```
選項：
(1) 最後會印出 2 個字串
(2) `awardMoney` 最後的值為 85
(3) `awardMoney` 最後的值為 50



<!-- 解答：  

1. 2
2. 3
-->


### 10/28 Day20：[函式與陣列物件整合運用]
🏅 Day 20 - 函式與陣列物件整合運用

綜合前幾天函式觀念以及陣列物件相關操作，回答下方問題。

##### 問題
---
依照註解敘述，完成下方程式碼（只需要補上 `...` 的部分，其餘不要更動）
```javascript=
let courses = [
  {
    title: 'Javascript',
    members: 400,
    id: 1,
    isStarted: true,
    isSoldout: true,
    tasks: ['主線任務', '每日任務']
  }
];
let newCourse = {
  title: 'Vue3',
  members: 300,
  id: 2,
  isStarted: false,
  isSoldout: true,
  tasks: ['主線任務', '每日任務']
};

// 1. 請將 courses 陣列中 id 為 1 的物件，tasks 陣列新增一筆資料為 '每日刷題'。
...

// 2. 請完成下方函式，將物件做為參數，判斷當課程中的 isSoldout 屬性為 true 時，
//    就將此物件新增到 courses 陣列中，並回傳 courses 陣列的長度
//   （只需要補上 ... 的部分，其餘不要更動）

function addCourse(courseObj) {
  if(...) {
    courses....;
    return ...;
    console.log('新增成功'); 
  } else {
    console.log('無法新增');
    return ...;
  }
  return;
}
let coursesLength = addCourse(newCourse);

// 3. 完成上方程式碼後，選出正確敘述
// 選項：
// (1) 最後程式碼會印出 '新增成功'，而變數 coursesLength 的值會變為 2
// (2) 最後程式碼不會印出任何字串
// (3) 如果 newCourse 的 isSoldout 屬性值為 false 時，執行 addCourse(newCourse) 將不會印出任何字串，也不會回傳 courses 陣列的長度
```



<!-- 解答：  

```javascript=
let courses = [
  {
    title: 'Javascript',
    members: 400,
    id: 1,
    isStarted: true,
    isSoldout: true,
    tasks: ['主線任務', '每日任務']
  }
];
let newCourse = {
  title: 'Vue3',
  members: 300,
  id: 2,
  isStarted: false,
  isSoldout: true,
  tasks: ['主線任務', '每日任務']
};

// 1. 
courses[0].tasks.push('每日刷題');

// 2. 
function addCourse(courseObj) {
  if(courseObj.isSoldout) {
    courses.push(courseObj);
    return courses.length;
    console.log('新增成功'); 
  } else {
    console.log('無法新增');
    return courses.length;
  }
  return;
}
let coursesLength = addCourse(newCourse);

// 3. 完成上方程式碼後，選出正確敘述
// 答案：(2)
```
-->





## 其他連結
1. [CodeWar刷題筆記](https://hackmd.io/vHCUR-I_TWmUQbHKcyvhqQ)