当前位置:网站首页>JS promotion: array flattening in JS
JS promotion: array flattening in JS
2022-07-27 23:55:00 【The..Fuir】
var courseLists = [{ "name": "My Courses", "courses": [{ "id": 511019, "title": "React for Beginners", "covers": [{ width: 150, height: 200, url: "http://placeimg.com/150/200/tech" }, { width: 200, height: 200, url: "http://placeimg.com/200/200/tech" }, { width: 300, height: 200, url: "http://placeimg.com/300/200/tech" }], "tags": [{ id: 1, name: "JavaScript" }], "rating": 5 }, { "id": 511020, "title": "Front-End automat workflow", "covers": [{ width: 150, height: 200, url: "http://placeimg.com/150/200/arch" }, { width: 200, height: 200, url: "http://placeimg.com/200/200/arch" }, { width: 300, height: 200, url: "http://placeimg.com/300/200/arch" }], "tags": [{ "id": 2, "name": "gulp" }, { "id": 3, "name": "webpack" }], "rating": 5 }] }, { "name": "New Release", "courses": [{ "id": 511022, "title": "Vue2 for Beginners", "covers": [{ width: 150, height: 200, url: "http://placeimg.com/150/200/nature" }, { width: 200, height: 200, url: "http://placeimg.com/200/200/nature" }, { width: 300, height: 200, url: "http://placeimg.com/300/200/nature" }], "tags": [{ id: 1, name: "JavaScript" }], "rating": 5 }, { "id": 511023, "title": "Angular2 for Beginners", "covers": [{ width: 150, height: 200, url: "http://placeimg.com/150/200/people" }, { width: 200, height: 200, url: "http://placeimg.com/200/200/people" }, { width: 300, height: 200, url: "http://placeimg.com/300/200/people" }], "tags": [{ id: 1, name: "JavaScript" }], "rating": 5 }] }]; /* var result = courseList Do not use indexes directly covers[0], Please use concatAll, map, filter, forEach complete result The result is [ { id: 511019, title: "React for Beginners", cover: "http://placeimg.com/150/200/tech" }, { id: 511020, title: "Front-End automat workflow", cover: "http://placeimg.com/150/200/arch" }, { id: 511022, title: "Vue2 for Beginners", cover: "http://placeimg.com/150/200/nature" }, { id: 511023, title: "Angular2 for Beginners", cover: "http://placeimg.com/150/200/people" }, ] */
Try a solution :
/* courseLists.forEach((firstValue) => { // console.log(firstValue.courses.values()); for (const iterator of firstValue.courses.values()) { var result = {} result.id = iterator.id; result.title = iterator.title; result.covers = iterator.covers; console.log(result); } }) */ /* let result = [] courseLists.forEach(item => { item.courses.forEach(item2 => { let obj = { id: item2.id, title: item2.title, cover: item2.covers[0].url } result.push(obj) }) }) console.log(result); */ /* courseLists.forEach((firstValue) => { // console.log(firstValue.courses.values()); for (const iterator of firstValue.courses.values()) { var result = {} result.id = iterator.id; result.title = iterator.title; iterator.covers.forEach((value)=>{ result.cover=value.url }) console.log(result); } }) */ /* let a=courseLists.map(({ courses }) => { return courses.map(({ id, title, covers }) => { return covers.map(({ url }) => ({ id, title, url, })); }); }).flat(3); console.log(a); */ /* let result=[] courseLists.forEach(courseLists=>{ courseLists.courses.forEach(course=>{ let obj={ id:course.id, title:course.title, cover:'' } for(let i=0;i<course.covers.length;i++){ let {url}=course.covers[i]; if(url.includes('150/200')){ obj.cover=url; break; } } result.push(obj); }) }) console.log(result); */ const newArr = courseLists .map(item => item.courses).flat(1) .map(outItem => outItem.covers .filter(item => item.width === 150 && item.height === 200) .map(item =>({ id: outItem.id, title: outItem.title, cover: item.url })) ).flat(1)
边栏推荐
- 2022 summer vacation daily question (5)
- How to bold font in Latex & how to make circle serial number
- 29. Learn the stacked column chart of highcharts using percentage
- TCP sticking and unpacking problem + Solution
- 基于原生js实现今日新闻网站
- My annual salary is 1million, and I don't have clothes more than 100 yuan all over my body: saving money is the top self-discipline
- Control mode of CPU
- Latex common summary (2): input matrix (input matrix, diagonal matrix, equations, etc.)
- The total investment is 60billion! Foxconn semiconductor high-end package test project officially settled in Qingdao
- BUUCTF-Dangerous RSA
猜你喜欢

Put cloudflare on the website (take Tencent cloud as an example)

为什么 Redis 集群要使用反向代理? 看这篇就明白了

【开发教程11】疯壳·ARM功能手机-定时器实验教程

Redis 哈希Hash底层数据结构

主数据管理理论与实践

org.junit.runners.model. InvalidTestClassError: Invalid test class ‘com.zhj.esdemo. MysqlTests‘: 1.

NDK series (6): let's talk about the way and time to register JNI functions

2022年土木,建筑与环境工程国际会议(ICCAEE 2022)

2022夏暑假每日一题(五)

How Flink uses savepoint
随机推荐
Sort sort
Latex中如何加粗字体 & 如何打出圆圈序号
MySQL之数据查询(WHERE)
[RoarCTF2019]babyRSA威尔逊定理
The first activity of togaf10 standard reading club was successfully held, and the wonderful moments were reviewed!
UE4官方AEC蓝图案例课程学习笔记
BUUCTF-[BJDCTF2020]RSA1
Is it really hard to understand? What level of cache is the recyclerview caching mechanism?
重新定义分析 - EventBridge 实时事件分析平台发布
UE4 official AEC blueprint case course learning notes
Comparison between virtual memory and cache
面试官问线程安全的List,看完再也不怕了!
基于原生js实现今日新闻网站
[NCTF2019]babyRSA1
BUU-CTF basic rsa
Accelerate IGBT localization! BYD semiconductor will be listed independently, with a market value of 30billion yuan!
TFRecord的Shuffle、划分和读取
Redis hash underlying data structure
Design and implementation of spark offline development framework
Nail alarm tool