Modify list of objects using Javascript ES6

Question

I have below array of objects with vertical as string and projects as array of objects inside it. projects can be empty too. Each projects entry if not empty, will have name and releaseType as properties.

[
  {
    "vertical": "Alpha",
    "projects": [
      {
        "name": "Test",
        "releaseType": ""
      }
    ]
  },
  {
    "vertical": "Beta",
    "projects": []
  },
  {
    "vertical": "Gamma",
    "projects": [
      {
        "name": "Lincoln",
        "releaseType": "Google Pay"
      },
      {
        "name": "Madison",
        "releaseType": "PayPal"
      }
    ]
  }
]

I want to get the list of projects in below format. Can someone please let me know how to achieve this. This isn't regular filter method, but it requires a bit of manipulation using map. I tried few things, but I was not able to achieve expected result.

[
  {
    "vertical": "Alpha",
    "feature": "Test",
     "releaseType": ""
  },
  {
    "vertical": "Gamma",
    "feature": "Lincoln",
     "releaseType": "Google Pay"
   },
   {
     "vertical": "Gamma",
     "feature": "Madison",
     "releaseType": "PayPal"
   }
]

Khanh Chau · Accepted Answer · 2021-06-08 14:58:20Z

3

You can use reduce for resolve it

arr.reduce((pre, cur) => {
  if (cur.projects.length) {
    pre.push(...cur.projects.map(p => ({
      vertical: cur.vertical,
      feature: p.name,
      releaseType: p.releaseType,
    })))
  }

  return pre;
}, []);

answered Jun 8, 2021 at 14:58

Khanh Chau

1311 bronze badge

Sign up to request clarification or add additional context in comments.

Comments

ulou · Accepted Answer · 2021-06-08 14:57:35Z

1

Double flatMap, should solve this pretty well:

const input = [{vertical:"Alpha",projects:[{name:"Test",releaseType:""}]},{vertical:"Beta",projects:[]},{vertical:"Gamma",projects:[{name:"Lincoln",releaseType:"Google Pay"},{name:"Madison",releaseType:"PayPal"}]}];

const res = input.flatMap(e => 
  e.projects.flatMap(x => [{vertical: e.vertical, ...x}])
)

console.log(res)

.as-console-wrapper { max-height: 100% !important; top: 0; } /* ignore this */

answered Jun 8, 2021 at 14:57

ulou

5,9326 gold badges40 silver badges51 bronze badges

Comments

tymeJV · Accepted Answer · 2021-06-08 14:53:09Z

1

You can use Array.reduce for this

let formattedProjects = arr.reduce((p, c, i, a) => {
    if (c.projects.length) {
        p = p.concat(c.projects.map(project => {
            return {
                vertical: c.vertical,
                feature: project.name,
                releaseType: project.releaseType
            }
        }));
    }

    return p;
}, []);

Demo: https://jsfiddle.net/6zk8jhat/

answered Jun 8, 2021 at 14:53

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Comments

Long Vu · Accepted Answer · 2021-06-08 15:15:57Z

1

let arr = [
  {
    vertical: "Alpha",
    projects: [
      {
        name: "Test",
        releaseType: "",
      },
    ],
  },
  {
    vertical: "Beta",
    projects: [],
  },
  {
    vertical: "Gamma",
    projects: [
      {
        name: "Lincoln",
        releaseType: "Google Pay",
      },
      {
        name: "Madison",
        releaseType: "PayPal",
      },
    ],
  },
];

arr = arr
  .map((obj) => {
    return obj.projects.map((proj) => {
      return {
        vertical: obj.vertical,
        ...proj,
      };
    });
  })
  .flat();

edited Jun 8, 2021 at 15:15

answered Jun 8, 2021 at 15:03

Long Vu

1802 silver badges15 bronze badges

Collectives™ on Stack Overflow

Modify list of objects using Javascript ES6

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related