---
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)

<!-- 解答:
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)
##### 筆記

### 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 可以有多個)
1. 函式可以用 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)