如何使用本机JavaScript合并数组中的对象

Question

I have an api that gives me the right data, but it's mostly the same data in each object. I want to restructure the objects in the array into one object.

This is the data that my api products currently.

 var data = [
     {maincategory: "AP", maincatname: "Abrasives", subcatname: "Abrasives 
    Accessories"},
     {maincategory: "AP", maincatname: "Abrasives", subcatname: "Non-woven 
     Abrasives"},
     {maincategory: "AP", maincatname: "Abrasives", subcatname: "Bonded 
     Abrasives"},
     {maincategory: "AP", maincatname: "Abrasives", subcatname: "Wire Brushes"},
    {maincategory: "AP", maincatname: "Abrasives", subcatname: "Coated 
    Abrasives"},

{maincategory: "AP", maincatname: "Abrasives", subcatname: "Specialty    
    Abrasives"},
    {maincategory: "AP", maincatname: "Abrasives", subcatname: "Super 
    Abrasives"}
    ];

var transformed= data.map(function(obj){
    var result= {
        key: obj.maincategory,
        values: []
    }
console.log(result)
    for (var key in obj) {
      if (obj.hasOwnProperty(key) && key !== "maincategory") {
          result.values.push([key, obj[key]]);
      }
    }
    return result;
});

console.log(transformed);

This is how I would like the data to be structured.

var data = [
  { 
     maincategory: "AP",
     maincatname: "Abrasives",
     subcatname: ['Abrasives Accessories','Non-woven Abrasives','Bonded Abrasives','Wire Brushes', etc]
  },
];

Answer 1

You can use array#reduce with Object.values() . Create an object lookup with maincategory and add maincategory , maincatname and subcatname corresponding to it and then take out values using Object.values() from this object.

 var data = [ {maincategory: "AP", maincatname: "Abrasives", subcatname: "Abrasives Accessories"}, {maincategory: "AP", maincatname: "Abrasives", subcatname: "Non-woven Abrasives"}, {maincategory: "AP", maincatname: "Abrasives", subcatname: "Bonded Abrasives"},{maincategory: "AP", maincatname: "Abrasives", subcatname: "Wire Brushes"}, {maincategory: "AP", maincatname: "Abrasives", subcatname: "Coated Abrasives"}, {maincategory: "AP", maincatname: "Abrasives", subcatname: "Specialty Abrasives"}, {maincategory:"AP", maincatname: "Abrasives", subcatname: "Super Abrasives"} ] result = Object.values(data.reduce((r, {maincategory, maincatname, subcatname}) => { r[maincategory] = r[maincategory] || {maincategory, maincatname, subcatname : []}; r[maincategory].subcatname.push(subcatname); return r; },{})); console.log(result); 

Answer 2

If you are sure that it's always the same data then you can have your result by using this function:

function transform(data){
  obj = {};
  obj['maincategory'] = data[0]['maincategory'];
  obj['maincatname'] = data[0]['maincatname'];
  obj['subcatnames'] = data.map(function(obj){ 
                       return obj.subcatname});
  return [obj]
}

To be honest the best solution is to fix the api to return a more structured results.

Answer 3

You can simply use Array.reduce to get that output:

 var data = [{ maincategory: "AP", maincatname: "Abrasives", subcatname: "Abrasives Accessories" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Non-woven Abrasives" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Bonded Abrasives" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Wire Brushes" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Coated Abrasives" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Specialty Abrasives" }, { maincategory: "AP", maincatname: "Abrasives", subcatname: "Super Abrasives" }] const r = data.reduce((r,c) => (r.subcatname = [...Array.isArray(r.subcatname) ? r.subcatname : [r.subcatname], c.subcatname], r)) console.log(r) 

The idea is since you only need the subcatname to be combined you can just use the Array.reduce and its basic form where it essentially acts as a merge .