# 🏅 4/29 (四) 每日任務 Day 4
###### tags: `Vue 直播班 - 2021 夏季班`
教學
---
這題需要額外理解的知識點為「[callback 函式](https://developer.mozilla.org/zh-TW/docs/Glossary/Callback_function)」,可以簡單的理解為:「把函式作為參數調用」。
舉例:
```js=
function greeting(arr) {
alert('Hello ' + arr.name);
}
// callback 函式
function processUserInput(callback, arr) {
callback(arr);
}
let arr = {name: "Jordan"};
// 在 callback 函式中調用 greeting 函式,並把 arr 也一併代入
processUserInput(greeting, arr);
```
題目 (使用 CodePen 作答)
---
以下 crowdAge 為部分民眾的年紀資料,請修改程式碼、篩選出屬性 age > 18 的陣列元素,並將它們一一加入 filterResult 這個陣列中。**(可以使用 [push()](https://wcc723.github.io/development/2020/10/04/js-array-methods/#Array-prototype-push) 或是 [filter() 函式](https://wcc723.github.io/javascript/2017/06/29/es6-native-array/))**
```js=
let crowdAge = [
{
name: 'Rick',
age: 17
},
{
name: 'Jane',
age: 25
},
{
name: 'Jordan',
age: 19
},
{
name: 'Jack',
age: 7
},
{
name: 'Reol',
age: 27
}
]
// callback 函式
function ageFilterCB(cb, arr) {
return cb(arr);
}
function ageFilter(arr) {
/* 只能在此插入程式碼 */
}
let filterResult = [];
filterResult = ageFilterCB(ageFilter, crowdAge);
console.log(filterResult); /* 為陣列,內容包含屬性 age > 18 的 crowdAge 元素 */
```
回報流程
---
請同學依照下圖教學觀看解答、回報答案:

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

<!-- 解法一
function ageFilter(arr) {
let target = arr.filter(item => item.age > 18);
return target;
}
-->
<!-- 解法二
function ageFilter(arr) {
let target = [];
arr.forEach(item => {
if(item.age > 18) {
target.push(item);
}
})
return target;
}
-->
回報區
---
<!--1:alpha
codepen:https://codepen.io/alphatero/pen/abprNqe
-->
<!-- 2: Vic
codepen: https://codepen.io/hsuan333/pen/zYNQqWV
-->
<!--3:Jasmin
codepen:https://codepen.io/thejasmin/pen/gOLaQva?editors=0011
-->
<!-- 4: 小魚
codepen: https://codepen.io/jarvis1993/pen/ExZzKOY?editors=0011
-->
<!-- 5: Alysa Chan
codepen: https://codepen.io/alysachan/pen/wvgbWwX?editors=0011
-->
<!-- 6: Jrhung-Tsai
codepen: https://codepen.io/Araytsai/pen/MWJdeKN?editors=0001
-->
<!-- 7: Chou Allen
codepen: https://codepen.io/eepson123tw/pen/jOyorMR?editors=1112
-->
<!-- 8: Yiren
codepen: https://codepen.io/Yiren_Liou/pen/BapeKEr?editors=0011
-->
<!-- 9: kevin嘉軒
codepen: https://codepen.io/kevin-chang-the-sasster/pen/vYgwKZp
-->
<!-- 10: tim Chou
codepen: https://codepen.io/tim-chou/pen/XWpwKgX?editors=1012
-->
<!-- 11: Harold
Codepen: https://codepen.io/YuWin0805/pen/VwPOjMr
-->
<!-- 11: Tori
Codepen: https://codepen.io/hayen/pen/poRYxEQ?editors=0011
-->
<!-- 12: leolee
Codepen: https://codepen.io/nekorice/pen/yLgWOpR
-->
<!--13: yijun
CodePen:
https://codepen.io/sandy3068/pen/KKaLMjd?editors=1111
-->
<!--14:Eva lin
CodePen:
https://codepen.io/evalin0316/pen/WNRBGbb?editors=1111
-->
<!--15: Yi Chieh
CodePen:
https://codepen.io/Yi-Chieh/pen/OJWYRye
-->
<!-- 16: Ethan
Codepen: https://codepen.io/blazer030/pen/QWdRKdN
-->
<!-- 17: youting
Codepen: https://codepen.io/youtingluo/pen/PoWvGjY?editors=0012
-->
<!-- 18: Chiang
Codepen: https://codepen.io/ChiangJ/pen/dyNEpEB?editors=1011
-->
<!-- 19: Echo Hui
Codepen: https://codepen.io/echohuiecho/pen/NWdVbqg-->
<!-- 20: shoppingq
Codepen: https://codepen.io/shoppingq/pen/qBRGqjW-->
<!-- 21: Iven
有些問題留在註解裡面,再麻煩助教幫我解答,謝謝。
Codepen: https://codepen.io/rtorihnk/pen/JjEqbJg?editors=0011-->
<!-- 22: Larry
Codepen:
https://codepen.io/manpower0708/pen/mdRYOqO?editors=0011 -->
<!-- 23: Ray
Codepen:
https://codepen.io/posidomcode/pen/zYNQojV -->
<!-- 24: Erica
Codepen: https://codepen.io/ericadu/pen/YzNbpJp -->
<!-- 25: Oober
Codepen: https://codepen.io/travis18/pen/PoWvbpW?editors=1112
-->
<!-- 26: Ted Kuo
Codepen: https://codepen.io/TedKuo/pen/BapepwG
-->
<!-- 27: Eric-小偉哥
Codepen: https://codepen.io/ericLoveDesign/pen/zYNQNmN?editors=1111
-->
<!--28: Joe Kuo
codepen: https://codepen.io/alertislow/pen/dyNEvNg?editors=0011
-->
<!--29: Alvin_Chu
CodePen:https://codepen.io/wave99487chu/pen/MWJdmaG
-->
<!-- 30:peter.chen1024
codepen: https://codepen.io/JIAN-RONG/pen/wvgbevX?editors=0012
-->
<!-- 31: Izumi 泉
CodePen: https://codepen.io/izumi-dev/pen/bGgyRZP
-->
<!-- 32: Sec
CodePen: https://codepen.io/Sentiments/pen/rNjgGGo?editors=1111
-->
<!-- 33: Alicia Lo
CodePen: https://codepen.io/dkcyhyre/pen/BapedRa
-->
<!-- 34: Amanda Chiang
CodePen: https://codepen.io/cym199922/pen/jOyoYow?editors=0011
-->
<!-- 34: jimmyfang
CodePen: https://codepen.io/pohxiqqo/pen/RwKmQxR?editors=0001
-->
<!-- 35: Lina Chen
CodePen: https://codepen.io/LinaChen/pen/bGgyLLY
-->
<!-- 36: Jessie Cheng
CodePen: https://codepen.io/JessieMosbi/pen/bGgyvyP?editors=1111
-->
<!-- 37: YOYO
CodePen: https://codepen.io/lumedkle/pen/ExZzLoQ?editors=1111
-->
<!-- 38: Ed Huang
CodePen: https://codepen.io/yide1986/pen/eYgarLe?editors=0012
-->
<!-- 39: Pon Peng
CodePen: https://codepen.io/pengpon77/pen/MWJdXLZ?editors=0012
-->
<!-- 40: 圈圈
CodePen: https://codepen.io/wei-the-lessful/pen/NWdVmdP?editors=0011
-->
<!-- 41: Wendy Li
CodePen: https://codepen.io/rockayumitw/pen/rNjgEWB?editors=0011
-->
<!--42:Wu Jung Han
codepen: https://codepen.io/JungHanWu/pen/JjEqgPy?editors=0012
-->
<!--43: Fred Chang
Codepen:https://codepen.io/fred8196/pen/ExZzqeE?editors=0010
-->
<!--44: 班尼
Codepen:https://codepen.io/fttp0165/pen/oNBrNwB?editors=1112
-->
<!--45: Jemma
Codepen:https://codepen.io/Jemma9/pen/eYgawPp?editors=0010
-->
<!--46: RitaHunag
Codepen: https://codepen.io/Rita-Rossweisse/pen/jOyopjO?editors=0011
-->
<!--47: 阿倫
Codepen:https://codepen.io/jason5125122/pen/KKajQqX
-->
<!--48: Carrie
Codepen:https://codepen.io/echocarriet/pen/JjEQLrX
-->
<!--49: Amber
Codepen:https://codepen.io/amberTing/pen/poRXxPW?editors=0011
-->
<!--50:陳sam
Codepen:https://codepen.io/euldpliv/pen/oNBKXxJ?editors=1111
-->
<!-- 51: Stacey Huang
Codepen:https://codepen.io/staceyhuang/pen/MWJNyJE?editors=0001
-->
<!-- 52: Li Shang
Codepen:https://codepen.io/li-shang/pen/mdRNmdY
-->
<!--53: Olga
Codepen:https://codepen.io/heavenbird_0221/pen/GRrVmoV?editors=1111
-->
<!--54: Dah
Codepen:https://codepen.io/hua0124/pen/KKaOvPL
-->
<!--55:家齊
Codepen:https://codepen.io/jacky298/pen/wvgVqQV
-->
<!--56:Jordan Tseng
Codepen:https://codepen.io/jordan-ttc-design/pen/MWJNErr?editors=1012
-->
<!--報數 57:Jack
Codepen:https://codepen.io/yxzzktmb/pen/VwPoyoE
-->
<!--報數 58:Echo
Codepen:
https://codepen.io/pen/?editors=1112
-->
<!--報數 59:Patrick
Codepen:
https://codepen.io/argent1027/pen/GRrVGXp?editors=0011
-->
<!--報數 60:moitw
Codepen:
https://codepen.io/tsuifei/pen/xxgveaL?editors=1111
-->
<!-- 報數61: Wei
CodePen: https://codepen.io/uwhhiaxx/pen/xxgvPMV?editors=0012
-->
<!--62:李重炫
codepen:https://codepen.io/otherway1123/pen/bGqbgyK?editors=1011
-->
<!--63:涂阿銘
codepen:https://codepen.io/asd40441/pen/xxqKqgE?editors=0011
-->
<!-- 64: Sean Liu
codepen: https://codepen.io/LuckyTiger/pen/PopYBgJ
-->
<!--
報數 65 : Valerie
codepen: https://codepen.io/vicky-chang/pen/LYWPJbb?editors=1012
-->
<!--
報數 66 : Eyan
codepen: https://codepen.io/somebody1997/pen/OJpJQmG?editors=1011
-->
<!-- 報數 67: Josh Fang
function ageFilter(arr) {
let result = arr.filter(item => item.age > 18);
return result;
}
codepen:
https://codepen.io/joshfang-the-encoder/pen/abJbqdW?editors=1113
-->
<!--
報數 68 : Chiayu
codepen: https://codepen.io/alphatero/pen/abprNqe?editors=0011
-->
<!--
報數 69 : Channing
codepen: https://codepen.io/Channing/pen/VwpYPNY
-->
<!--
報數 70 : twoz
codepen: https://codepen.io/twoz/pen/oNZgqwm?editors=0012
-->
<!--
報數 71 : Tofu Tseng
codepen: https://codepen.io/Tofutseng/pen/YzZPRKR?editors=0001
-->
<!--
報數 72 : Jay
codepen: https://codepen.io/jayredk/pen/jOBPEQe?editors=1012
-->
<!--
報數 73 : FuChang
CodePen: https://codepen.io/fuchang830714/pen/yLgmGEY
-->
<!--
報數 74 : Carol
CodePen: https://codepen.io/taonong/pen/XWMmMbq
-->
<!--
報數 75: MM
codePen: https://codepen.io/MINN3/pen/JjWGmjQ
-->
<!-- 報數 76: 田
codepen: https://codepen.io/ccyy915/pen/eYvZYJm
-->
<!-- 報數 77: Eason
codepen: https://codepen.io/alanwu0828/pen/poezQeL?editors=0012
-->
<!-- 報數 78: Andrew Chi
codePen:
https://codepen.io/wheresandrew/pen/yLMJwgZ
-->
<!-- 報數 79: kevinhes
codepen:
https://codepen.io/dwpwdpad/pen/dyvXxyV?editors=1011
-->
<!-- 報數 80: Emily Hsi
codepen:
https://codepen.io/EmilyHsi/pen/NWpbvOZ
-->
<!-- 報數 81: Butters
codepen:
https://codepen.io/Butterscode/pen/abJWLQW
-->
<!-- 報數 82: Shino
codepen:
https://codepen.io/shiiinnooo/pen/poeyprR
-->
<!-- 報數 83: WA
codepen:
https://codepen.io/ldddl/pen/ZEKzabz?editors=0010
-->
<!-- 報數 84: yolala
codepen:
https://codepen.io/chiakilalala/pen/qBxxoOV?editors=1011
-->