# 🏅 4/30 (五) 每日任務 Day 5
###### tags: `Vue 直播班 - 2021 夏季班`

參考文章: https://wcc723.github.io/javascript/2017/06/29/es6-native-array

#### map 介紹
> 1. 為 JavaScript 的陣列方法，可以用來「修改陣列元素」。
> 2. 不會影響原來的陣列，而是會透過函式內所回傳的值組合成一個新的陣列。
> 3. map() 需要設定回傳值，如果不設定則會回傳 undefined

舉例:

let arr = [1,2,3,4];
let newArr = arr.map((item) => {
     return item * 2;
});
console.log(arr); // 結果為: [1, 2, 3, 4]
console.log(newArr); // 結果為: [2, 4, 6, 8]

let arr = [1,2,3,4];
let newArr = arr.map((item) => {
     /*假設不設定回傳*/
});
console.log(newArr); // 結果為: [undefined, undefined, undefined, undefined]

題目 (使用 CodePen 作答)
---
請使用 map() 操作 array 陣列，賦予 newArray 陣列元素。結果如下圖:


const array = [
    {
      name: '小明',
      age: 18
    },
    {
      name: '小美',
      age: 15
    },
    {
      name: '杰倫',
      age: 19
    },
    {
      name: '漂亮阿姨',
      age: 22
    },
    {
      name: '老媽',
      age: 28
    }
];
let newArray = [];

回報流程
---
請同學依照下圖教學觀看解答、回報答案:


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


<!-- 解答
let newArray = array.map(item => {return `${item.name} ${item.age} 歲囉`});

// 也可以簡寫成
let newArray = array.map(item => `${item.name} ${item.age} 歲囉`);
-->

回報區
---

<!--01:alpha
codepen:https://codepen.io/alphatero/pen/VwPONWE
-->
<!--02:shoppingq
codepen:https://codepen.io/shoppingq/pen/vYgwMpb
-->

<!-- 03: Alysa Chan
codepen: https://codepen.io/alysachan/pen/oNBROEa?editors=0011 -->

<!-- 04: yijun
codepen:
https://codepen.io/sandy3068/pen/GRraLdb
-->

<!-- 05: Vic
codepen:
https://codepen.io/hsuan333/pen/wvgbZNM
-->

<!-- 06: Jrhung-Tsai
codepen:
https://codepen.io/Araytsai/pen/BapeEej?editors=0011
-->

<!-- 07: Tori
codepen:
https://codepen.io/hayen/pen/poRYxEQ?editors=0011
-->

<!-- 08: youting
codepen: https://codepen.io/youtingluo/pen/MWJddaQ?editors=0012
-->

<!-- 09: tim Chou
codepen:
https://codepen.io/tim-chou/pen/zYNQQoM?editors=1111
-->

<!-- 10: SONYKO
codepen:
https://codepen.io/s_syoujyo/pen/KKaLLyo?editors=0011
-->

<!--11: Yi Chieh
CodePen:
https://codepen.io/Yi-Chieh/pen/yLgWWvE
-->

<!--12: Iven
CodePen:
https://codepen.io/pen/?editors=0011
-->

<!--13: Lina Chen
CodePen:
https://codepen.io/LinaChen/pen/PoWvvMJ
-->

<!--14: Harold
CodePen:
https://codepen.io/YuWin0805/pen/WNRBqxa
-->

<!--15: Wendy Li
https://codepen.io/rockayumitw/pen/oNBRrwZ
-->

<!--16: Alvin Chu
codepen:https://codepen.io/wave99487chu/pen/ZELNdLg
-->

<!--17: chou allen
codepen: https://codepen.io/eepson123tw/details/JjEqQWK
-->

<!-- 18: Sec
codepen: https://codepen.io/Sentiments/pen/YzNboYr
-->

<!-- 19: Joe
codepen: https://codepen.io/alertislow/pen/oNBRrJG?editors=1111
-->

<!-- 20: Izumi 泉
CodePen: https://codepen.io/izumi-dev/pen/gOgEZzM
-->

<!-- 21: Ted Kuo
CodePen: https://codepen.io/TedKuo/pen/QWdReKb
-->

<!-- 22: cena
CodePen: https://codepen.io/hgdnkzkg/pen/poRmmVK
-->

<!-- 23: Fred Chang
CodePen: https://codepen.io/fred8196/pen/MWJdNZv?editors=1112
-->

<!-- 24: Larry
CodePen: https://codepen.io/manpower0708/pen/zYNVOrJ?editors=1011
-->

<!-- 25: peter.chen1024
codepen: https://codepen.io/JIAN-RONG/pen/OJWeLqj?editors=0012
-->

<!-- 26: Echo Hui
Codepen: https://codepen.io/echohuiecho/pen/VwPJwPp
-->

<!-- 27: 林班尼
codepen: https://codepen.io/fttp0165/pen/NWdZWRL?editors=1112
-->

<!-- 28: Ethan
codepen: https://codepen.io/blazer030/pen/oNBrgXE
-->

<!-- 28: Jemma
codepen: https://codepen.io/Jemma9/pen/KKajpKq?editors=0011
-->

<!-- 29： RitaHuang
Codepen：https://codepen.io/Rita-Rossweisse/pen/dyNBMyL?editors=0011
-->

<!-- 30: Oober
Codepen: https://codepen.io/travis18/pen/zYNVqgV
-->

<!-- 31: Alicia Lo
Codepen: https://codepen.io/dkcyhyre/pen/gOgNrXw
-->

<!-- 32: YOYO
Codepen: https://codepen.io/lumedkle/pen/vYgqKVp?editors=0112
-->

<!-- 33: Eric-小偉哥
Codepen: https://codepen.io/ericLoveDesign/pen/dyNByRv?editors=1111
-->

<!-- 34: Yu Chien
Codepen：https://codepen.io/yu_chien/pen/zYNVoRy?editors=0010
-->

<!-- 35: Pon Peng
Codepen：https://codepen.io/pengpon77/pen/eYgweKY?editors=0011
-->

<!-- 36: Ray
Codepen：https://codepen.io/codeocean9/pen/RwKzxWB
-->

<!-- 37: Amanda Chiang
Codepen：https://codepen.io/cym199922/pen/dyNBJNe?editors=0011
-->

<!-- 38: leo lee
Codepen：https://codepen.io/nekorice/pen/PoWrQzP
-->

<!-- 39: Wu jUNG Han
Codepen：https://codepen.io/JungHanWu/pen/RwKzQRb?editors=0012
-->

<!--40: 阿倫
Codepen:https://codepen.io/jason5125122/pen/dyNBdgP
-->

<!--41: Chiang
Codepen:https://codepen.io/ChiangJ/pen/zYNVJxK?editors=0011
-->

<!--41: jimmyFang
Codepen:https://codepen.io/pohxiqqo/pen/QWdXVEL?editors=1011
-->

<!--42: Amber
Codepen:https://codepen.io/amberTing/pen/YzNoJLP?editors=0011
-->

<!--43: Ed Huang
Codepen:https://codepen.io/yide1986/pen/RwKzqRp?editors=0012
-->
<!--44: 陳sam
Codepen:https://codepen.io/euldpliv/pen/rNjXagz?editors=1112
-->

<!--45:Jasmin
codepen:https://codepen.io/thejasmin/pen/vYyJpXL?editors=0011
-->

<!--46: JessieCheng
codepen:https://codepen.io/JessieMosbi/pen/MWJNKOy?editors=0010
-->

<!-- 47: Stacey Huang
Codepen:https://codepen.io/staceyhuang/pen/VwPoayo?editors=1011
-->
<!-- 48: 小魚
Codepen:https://codepen.io/jarvis1993/pen/PoWMpRL?editors=0011
-->
<!-- 49: Li Shang
Codepen:https://codepen.io/li-shang/pen/RwKXVPO
-->
<!-- 50: Olga
Codepen:https://codepen.io/heavenbird_0221/pen/yLgmbbo?editors=1111
-->
<!-- 51: Dah
Codepen:https://codepen.io/hua0124/pen/xxgvLVg
->>

<!-- 52: Carrie
Codepen: https://codepen.io/echocarriet/pen/KKaOPpa
->>

<!-- 53: Erica
Codepen: https://codepen.io/ericadu/pen/gOgVxMj
-->

<!-- 54: 家齊
Codepen:https://codepen.io/jacky298/pen/PoWMJGo
-->

<!-- 55: Jordan Tseng
Codepen:https://codepen.io/jordan-ttc-design/pen/WNRVZMp?editors=1012
-->

<!-- 55: Jack
Codepen:https://codepen.io/yxzzktmb/pen/gOgVvmO?editors=1011
-->

<!-- 56: Echo
Codepen:
https://codepen.io/bcq65958/pen/NWdQzqG?editors=1112
-->

<!-- 57: Patrick
Codepen:
https://codepen.io/argent1027/pen/BapXPpd?editors=1011
-->

<!-- 58: moitw
Codepen:
https://codepen.io/tsuifei/pen/BapXEEg?editors=0012
-->

<!-- 報數59: Wei
CodePen: https://codepen.io/uwhhiaxx/pen/bGqbGdR?editors=0012
-->

<!-- 報數60: 圈圈
CodePen: https://codepen.io/wei-the-lessful/pen/MWpgWMd?editors=0012
-->

<!-- 報數60: 李重炫
CodePen: https://codepen.io/otherway1123/pen/vYxBxYZ?editors=1011
-->

<!-- 報數61: 涂阿銘
CodePen: https://codepen.io/asd40441/pen/oNZvZoe?editors=0011
-->

<!--報數62: SeanLiu
codepen:https://codepen.io/alphatero/pen/MWpgqNy
-->

<!--
報數 63 : Valerie
codepen: https://codepen.io/vicky-chang/pen/RwpbebY?editors=1012
-->

<!-- 報數 64: Josh Fang
答案
let newArray = array.map(item => `${item.name} ${item.age} 歲囉`);
-->

<!-- 報數 65: Yiren
codepen: https://codepen.io/Yiren_Liou/pen/GRWgJLa?editors=0012
-->

<!-- 報數 66: Eyan
codepen: https://codepen.io/somebody1997/pen/WNpbrjy?editors=0111
-->
<!-- 報數 67: Chiayu
codepen: https://codepen.io/c85771029/pen/wvJBoBQ
-->

<!-- 報數 68: Channing
codepen: https://codepen.io/Channing/pen/VwpYpee
-->

<!-- 報數 69: Tofu Tseng
codepen: https://codepen.io/Tofutseng/pen/xxqbQwW?editors=0011
-->

<!-- 報數 70: twoz
codepen:
https://codepen.io/twoz/pen/LYWVYav?editors=0012
-->

<!-- 報數 71: Jay
codepen:
https://codepen.io/jayredk/pen/bGqdNZK?editors=1011
-->

<!-- 報數 72: FuChang
CodePen: https://codepen.io/fuchang830714/pen/mdRNaoa
-->

<!-- 報數 73: Carol
CodePen: https://codepen.io/taonong/pen/RwpWpGN
-->

<!-- 報數 74: MM
codePen: https://codepen.io/MINN3/pen/JjWGmjQ
-->

<!-- 報數 75: 田
codepen: https://codepen.io/ccyy915/pen/MWpyWmY
-->

<!-- 報數 76: Andrew Chi
codePen:https://codepen.io/wheresandrew/pen/XWMKQLV
-->

<!-- 報數 77: kevinhes
codepen:
https://codepen.io/dwpwdpad/pen/JjWRMXW?editors=0011
-->

<!-- 報數 78: Emily Hsi
codepen:
https://codepen.io/EmilyHsi/pen/LYWbjae
-->

<!-- 報數 79: Butters
codepen:
https://codepen.io/Butterscode/pen/poePWXg
-->

<!-- 報數 80: WA
codepen:
https://codepen.io/ldddl/pen/gOWYXgK?editors=0010
-->

<!-- 報數 81: yolala
codepen:
https://codepen.io/chiakilalala/pen/qBxYYQg
-->