---
tags: Vue 直播班 - 2022 春季班
---
# 🏅 Day 15
###### tags: `Vue 直播班 - 2022 春季班`
題目 (請將答案貼上 CodePen)
---
參考: https://wcc723.github.io/javascript/2017/12/25/javascript-destructuring/
(1) 依據提示將以下程式碼用解構方式達成目標
```js=
// 題目一: 請使用解構,取出 name 及 age 的變數
const person = {
name: '小明',
age: 16
}
console.log(name, age); // 結果為 "小明", 16
// 題目二: 請問以下 console.log 的輸出結果為何?
let [a, b, c = 4, d = 'New', e] = [1, 2, 3];
console.log(a, b, c, d, e);
```
參考:https://wcc723.github.io/javascript/2017/12/24/javascript-spread-operator/
(2)依據提示將以下程式碼用展開方式達成目標
```js=
// 題目一: 請使用展開將 arr 的內容併入 arrNew
let arr = [1, 2, 3];
let arrNew = [?, 4, 5, 6]; // [1, 2, 3, 4, 5, 6]
console.log(arrNew);
// 題目二: 請使用展開將 restInfo 的內容併入 MingInfo
let restInfo = {
sex: '男生',
height: 178
}
let MingInfo = {
name: '小明',
age: 20,
}
```
(3) 請修改以下程式碼,透過 [參數預設值](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Functions/Default_parameters)、[其餘參數](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Functions/rest_parameters) 的方式完成此範例。
```js=
function getMoney(/* 填入程式碼 */) {
return money;
}
let myMoney = getMoney();
// fruits 是一個陣列
function buySomething(/* 填入程式碼 */) {
if(fruits.length > 2) {
myMoney -= 200;
}else {
myMoney -= 100;
}
console.log(`小明剩下 ${myMoney} 元`);
}
buySomething('lemon', 'watermelon', 'kiwi'); // 結果為 "小明剩下 300 元"
buySomething('lemon', 'watermelon'); // 結果為 "小明剩下 200 元"
```
回報流程
---
請同學依照下圖教學觀看解答、回報答案:

回報格式如下圖,請在「回報區」使用註解回報答案 (為了統計人數,請同學依序加上「報數」)

<!-- 解答
(1)
// 題目一
const person = {
name: '小明',
age: 16
}
const {name, age} = person;
console.log(name, age);
// 題目二
1, 2, 3, "New", undefined
(2)
// 題目一
let arr = [1, 2, 3];
let arrNew = [...arr, 4, 5, 6];
console.log(arrNew);
// 題目二
let restInfo = {
sex: '男生',
height: 178
}
let MingInfo = {
name: '小明',
age: 20,
...restInfo
}
(3)
// fruits 是一個陣列
function getMoney(money = 500) {
return money;
}
function buySomething(...fruits) {
let myMoney = getMoney();
if(fruits.length > 2) {
myMoney -= 200;
}else {
myMoney -= 100;
}
console.log(`小明剩下 ${myMoney} 元`);
}
buySomething('lemon', 'watermelon', 'kiwi');
buySomething('lemon', 'watermelon');
-->
回報區
---
| 報數 |組別/名字 | codepen / 其他回饋 |
|:--------:| -------- | -------- |
|1|CloThEs | https://codepen.io/bogwdnxx-the-sans/pen/KKXboaV|
|2| Larry | https://codepen.io/larrylinr5/pen/xxXmWOP?editors=1111 |
|3| 肉鬆 | https://codepen.io/klrkicog/pen/LYzMdZd?editors=0011 |
|4| Iris Huang | https://codepen.io/ythuang/pen/qBPLoNx |
|5| POPEYE | https://codepen.io/popeye_ux/pen/yLzGKVJ |
|6| 黃士桓 | https://codepen.io/shr-huan-huang/pen/gOGZeKV?editors=0011 |
|7|Yof| https://codepen.io/yangyof/pen/mdBGgNj?editors=1011 |
|8|Aaron Tu|https://codepen.io/aarontu/pen/KKXbRzX|
|9|Wenfish|https://codepen.io/wenfisht/pen/RwLEywb|
|10|有廖先生(Rain)|https://codepen.io/billpop741/pen/GRMPdBN|
|11|AllenW|https://codepen.io/AllenW/pen/Jjrwvrq|
|12|群嘉|https://codepen.io/efzdamnp-the-lessful/pen/JjrwvOQ?editors=1111|
|13|Jasper|https://codepen.io/li-jasper/pen/WNZLJWJ |
|14|Empty Wu|https://codepen.io/emptywu/pen/mdBaKew |
|15|Gill|https://codepen.io/Gill-Chin/pen/qBPLYpe?editors=0011 |
|16|Elaine Liu|https://codepen.io/elaine7598/pen/gOGZzLr?editors=0010|
|17|Yunei| https://codepen.io/Yunei/pen/poWqKrm |
|18|威爾|https://codepen.io/WILL_Wu/pen/ZEXVRRY|
|19|hua|https://codepen.io/hahahazzz123/pen/rNGoKpV?editors=1111|
|20|Bella Shya|https://codepen.io/BellaXie/pen/ExwGRbP?editors=0011|
|21|kevinhes|https://codepen.io/kevinhes/pen/abLPKaB?editors=0012|
|22|Henry|https://codepen.io/kaohenry9287/pen/MWEZBwy|
|23| Kelvin Hsu | https://codepen.io/kelvin001/pen/mdBajbG?editors=0010 |
|24|John|https://codepen.io/jiangshuuu/pen/NWaXXWb
|25|Laura|https://codepen.io/minminn/pen/OJxrZMX|
|26|Himi|https://codepen.io/Himi/pen/mdBajpg|
|27|陳暐中|https://codepen.io/wei-z/pen/VwMqBoO?editors=0011|
|28|Tim Lin|https://codepen.io/TimmyLin/pen/VwMqBJN|
|29|Howard|https://codepen.io/yawdnhbm/pen/yLzQmME|
|30|dOvOb|https://codepen.io/gezzgrwj-the-styleful/pen/jOGXvWw?editors=1111
|31|Scottie|https://codepen.io/wow767t/pen/XWeoPpP|
|32|Pei Ying|https://codepen.io/Pei-Ying/pen/zYEyavO?editors=0011|
|33|Sheep| https://codepen.io/SheepNDW/pen/VwMqGwO |
|34|Calon|https://codepen.io/Calon0118/pen/XWeoPXB|
|35|tingyu| https://codepen.io/dgltu/pen/zYEyJPy?editors=0011 |
|36|Charlotte Lee| https://codepen.io/charlotte-lee/pen/MWEZXNK?editors=0010 |
|37|Henry Wu| https://codepen.io/dkcmlaww-the-flexboxer/pen/QWqzZbV?editors=0011 |
|38|DDDDK| https://codepen.io/dkklee/pen/YzrdJpV |
|39|Arista| https://codepen.io/arista-hsieh/pen/bGoOmLQ |
|40|andersonshen|https://codepen.io/luxyenni-the-bold/pen/jOGXQVP |
|41|YC|https://codepen.io/YCLu/pen/eYGQZjB |
|42|我是泇吟|https://codepen.io/kljuqbxs/pen/ZEXVVQr|
|43|Rick Tzeng|https://codepen.io/rick917jp6/pen/WNZLLXZ?editors=0012
|44|AKI|https://codepen.io/akichen27/pen/XWeoOVb |
|45|Terry21|https://codepen.io/feng0409/pen/oNGJyEW?editors=0012 |
|46|Yummyniya|https://codepen.io/yummyniya/pen/abLPgyV|
|47|Otis|https://codepen.io/humming74/pen/eYGbwev?editors=0011 |
|48| Vicky | https://codepen.io/hyxfish27/pen/RwLEzLE |
|49| Liu | https://codepen.io/feng-chi-liu/pen/ZEXwOEb?editors=1111 |
|50|Steven Chan|https://codepen.io/Steven1220/pen/bGozeOd?editors=1011 |
|51|shio|https://codepen.io/pen/?editors=1111 |
|52|Jason Chen|https://codepen.io/jason60810/pen/RwLvpWX |
|53|海底藍|https://codepen.io/registermar3/pen/abLXVXq?editors=1011 |
|54|Bonnie|https://codepen.io/bonnieli1414/pen/PoJVbPK?editors=1112 |
|55|柴貓|https://codepen.io/shibacat/pen/zYEeRzO |
|56|小K|https://codepen.io/kelen1995/pen/wvrNNPm |
|57|咖咖|https://codepen.io/gon790219/pen/bGoOzgj |
| 58 | Sihle Huang | https://codepen.io/bugbug777/pen/LYzqvmv |
|59|Jordan Tseng|https://codepen.io/jordan-ttc-design/pen/BawbBmJ?editors=1011|
|60|Anna|https://codepen.io/kycrleao/pen/rNGRVeP|
|61|Judy☻|https://codepen.io/hsiaohan/pen/VwMRpmg?editors=0011|
|62|Benson|https://codepen.io/soul81624/pen/GRMeymV |
|63|阿武|https://codepen.io/samwnkyat/pen/MWExQBx
|64|Gui|https://codepen.io/guitimliu/pen/LYzaQmG
|65|mei|https://codepen.io/Shila-Chen/pen/bGoZxPq|
|66|Evan Chiang|https://codepen.io/piskesocute/pen/MWExLrz|
|67|kk|https://codepen.io/potatokaka/pen/eYGwEBp?editors=0011|
|68|Abbie|https://codepen.io/Abbie0704/pen/xxXoYgz|
|69| Meng | https://codepen.io/MGHN/pen/bGoPLLe?editors=0012 |
|70| 肉桂卷 |https://codepen.io/ginnlee/pen/KKXjyoG?editors=0011|
|71| Jerry Yen |https://codepen.io/JerryYen/pen/OJxKYJd|
|72|許敏鑫|https://codepen.io/MIN-HSIN/pen/WNXewzv?editors=1111
|73|Jerry|https://codepen.io/rteyfwwd-the-scripter/pen/WNXeBoq|
|74|阿劍| https://codepen.io/seonkuraito/pen/VwMgaOr |
|75|Hedy| https://codepen.io/hhhsuan41/pen/WNZmEPj?editors=1112 |
|76|Bruno Yu| https://codepen.io/bruno-yu/pen/MWOWYKP?editors=1111|
|77| ShaoYu | https://codepen.io/shaoyukao/pen/mdqdoNe |
|78|Riley|https://codepen.io/jjpxbprd/pen/mdqyyZM?editors=1111|
|79|2/WA|https://codepen.io/ldddl/pen/dyZPOZz|
|80|FuChang|https://codepen.io/fuchang830714/pen/oNGmvme|
|81|JD孟璁|https://codepen.io/oikdkmxq-the-looper/pen/rNYORea?editors=1011 |
|82|andyii|https://codepen.io/gultrotpybyvue/pen/podeLOe|
|83|Mylène|https://codepen.io/hamajibashi/pen/NWwgqwz|
|94|大衛|https://codepen.io/exnsrpjc/pen/yLpJxqP?editors=1011 |
|95|Carol Li|https://codepen.io/carolli834/pen/abYRQEZ?editors=1011 |