--- tags: JS 直播班 - 2023 秋季班 --- # 🏅 Day 35 - 多筆物件取值 ### Object.keys(), Object.values() 使用練習 * Object.keys() 可以取得指定物件的所有 key 值,並回傳一個陣列。 * Object.values() 可以取得指定物件的所有 value 值,並回傳一個陣列。 ```javascript= const object1 = { a: "字串", b: 42, c: false }; console.log(Object.keys(object1)); // 結果: ["a", "b", "c"] console.log(Object.values(object1)); // 結果: ["字串", 42, false] ``` 問題 --- 請練習使用 Object.keys(),修改資料格式,並存入名稱為 answer 的物件,格式如下圖: ![](https://i.imgur.com/7pA41y0.png) 範例程式碼: ```javascript= let answer = {}; // 請把修改完的資料存入 answer 物件。 let url = "https://raw.githubusercontent.com/hexschool/js-traninging-week6API/main/data.json"; axios.get(url) .then(function(response) { let total = {}; let data = response.data; data.forEach(function(item, i) { if(total[item.jsGroup] === undefined) { total[item.jsGroup] = 1; } else { total[item.jsGroup] += 1; } }); // 將整理好的 total 資料調整成圖中的格式存入 answer 中 /* 程式碼開始 */ /* 程式碼結束 */ console.log(answer); }); ``` ## 回報流程 將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 解答位置請參考下圖(需打開程式碼的部分觀看) ![](https://i.imgur.com/vftL5i0.png) <!-- 解答: ``` let answer = {}; let url = "https://raw.githubusercontent.com/hexschool/js-traninging-week6API/main/data.json"; axios.get(url) .then(function(response) { let total = {}; let data = response.data; data.forEach(function(item, i) { if(total[item.jsGroup] === undefined) { total[item.jsGroup] = 1; } else { total[item.jsGroup] += 1; } }); let keyName = Object.keys(total); keyName.forEach(function(item) { if(item !== "未分組") { answer[`第 ${item} 組人數`] = total[item]; } else { answer[`${item}人數`] = total[item]; } }); console.log(answer); }); ``` 進一步解說解答程式碼: https://codepen.io/jmimiding4104/pen/rNoGmoY?editors=1111 --> 回報區 --- | Discord | CodePen / 答案 | |:---------------------:|:----------------------------------------------------------------------------:| | Yijing | [CodePen](https://codepen.io/Yi-Jing-71080635/pen/vYbjRyP?editors=1011) | | JUNEW | [CodePen](https://codepen.io/June-W/pen/rNPvRmG) | | 風羽 | [CodePen](https://codepen.io/Joy-Huang/pen/NWoMVyJ?editors=1011) | | pinyi_9 | [CodePen](https://codepen.io/Wpypy/pen/YzBLoOb?editors=1011) | | SHUO | [CodePen](https://codepen.io/xrzarxkl-the-reactor/pen/YzBLmzK?editors=1112) | | yuan! | [CodePen](https://codepen.io/townyuan/pen/QWYreWg) | | Chia Pin | [CodePen](https://codepen.io/joker-cat/pen/ZEwogam) | | 維哲 | [CodePen](https://codepen.io/kwz1202/pen/MWLGrQZ) | | Peng | [CodePen](https://codepen.io/H-Peng/pen/eYxrqQo?editors=1011) | | Uli | [CodePen](https://codepen.io/uli1313/pen/YzBvKWQ?editors=1011) | |Moreene|[CodePen](https://codepen.io/Moreene/pen/RwvJbEB)| |celinelinnn|[CodePen](https://codepen.io/celinephoebe/pen/XWOYrYK)| | lychee_kk | [CodePen](https://codepen.io/kakakala/pen/JjxZPzy?editors=1010) | |CPing|[CodePen](https://codepen.io/CPing/pen/gOqKOzY?editors=1011)| |Alyce|[CodePen](https://codepen.io/alycehwy/pen/PoVaorZ?editors=0010)| | cest_jessie | [CodePen](https://codepen.io/itsjessiechen/pen/LYqrYyB) | | 精靈 | [CodePen](https://codepen.io/justafairy/pen/ZEwREma) | | Winnie | [CodePen](https://codepen.io/codepen-io-winnie/pen/qBgKBKJ?editors=0011) | |kawa | [CodePen](https://codepen.io/z83xji6/pen/WNPyvxY?editors=1010) | | tanuki5863 | [CodePen](https://codepen.io/tanuki320/pen/dyaKomV?editors=1011) | | stone4584 | [CodePen](https://codepen.io/Royen0506/pen/XWOYbyj?editors=1111) | | dora | [CodePen](https://codepen.io/dorayu/pen/dyaexaX) | | 保羅 | [CodePen](https://codepen.io/paul-1997/pen/GRzGZLY?editors=0011) | | 奔跑吧(GTR150) | [CodePen](https://codepen.io/Wer-Qwe/pen/qBgKNqo) | | yuan2781 | [CodePen](https://codepen.io/ismebir/pen/gOqzVBR) | | yu.t_liu | [CodePen](https://codepen.io/YuT200053/pen/RwvJoPg?editors=0011) | | Ataraxia | [CodePen](https://codepen.io/ataraxia8888/pen/abXqjyX) | | runweiting | [CodePen](https://codepen.io/weiting14/pen/XWOeeQw) | | ann6212 | [CodePen](https://codepen.io/yqmegupa-the-styleful/pen/LYqrLvM?editors=1112) | | 郭芙蘭#6374 | [CodePen](https://codepen.io/flora_Kuo/pen/jOdKaJy?editors=1011) | | Fabio20 | [CodePen](https://codepen.io/fabio7621/pen/WNPyYzQ?editors=1112) | | 小夏 | [CodePen](https://codepen.io/michaelhsia/pen/gOqKQEY) | | xuan | [CodePen](https://codepen.io/xuan0915/pen/dyaKwME?editors=1012) | | MY | [CodePen](https://codepen.io/ahmomoz/pen/ExrRGdJ?editors=1012) | | claire | [CodePen](https://codepen.io/yi-wen-chen/pen/NWozKao) | | santu0868 | [CodePen](https://codepen.io/HatsumiSan/pen/VwgdJOR?editors=1111) | | ⭐小正 | [CodePen](https://codepen.io/colorgolden/pen/BaMVYbv?editors=1111) | | kuanju27 | [CodePen](https://codepen.io/Eero-Chiao/pen/NWoBGbQ) | | Lainie | [CodePen](https://codepen.io/Lainie88/pen/zYejgVO?editors=0112) | | Ching | [CodePen](https://codepen.io/tzuchingg/pen/OJdwMap?editors=1011) | | xin | [CodePen](https://codepen.io/Estherrrrrr999/pen/KKJBzQE) | | Oria | [CodePen](https://codepen.io/kajing/pen/abXjLmo?editors=0012) | | 荷菓かのり | [CodePen](https://codepen.io/oogxwkvw-the-builder/pen/XWOBQqB?editors=1112) | | bf_tsai | [CodePen](https://codepen.io/BF-Tsai/pen/KKJxgzN?editors=0011) | | damon0323 | [CodePen](https://codepen.io/swk9eny2/pen/vYbaVWx) | | macihuang | [CodePen](https://codepen.io/macy1215/pen/qBgMqQZ) | | hsu0921 | [CodePen](https://codepen.io/HSUANIN0327/pen/VwgGpNZ) | | gebyman | [CodePen](https://codepen.io/gebyman/pen/MWLBxxJ?editors=0011) | | Vivian2857 | [CodePen](https://codepen.io/vivian_lin/pen/ZEwqWMV?editors=1011) | | 歐陽龍龍#1061 | [CodePen](https://codepen.io/dizzydog-rgb/pen/LYqgwEz) | | skypassion5000 | [CodePen](https://codepen.io/skypassion5000/pen/vYbQBxY?editors=0011) | | Daylily | [CodePen](https://codepen.io/daylily/pen/VwgVJbj) | |阿榮|[Codepen](https://codepen.io/codeitaday/pen/yLZZgPE)| |sponge|[Codepen](https://codepen.io/biunpujm-the-flexboxer/pen/oNmmRaa?editors=1111)| | NathanJames | [CodePen](https://codepen.io/ufo060204/pen/PoVVvQr) | | 辣椒 | [CodePen](https://codepen.io/chilichen118/pen/bGzZppy) | ChrisSQR | [CodePen](https://codepen.io/ChrisSQR/pen/qBgJopR) <!--快速複製 | Name | [CodePen]() | -->