Filter nested JSON object with multiple arrays and store the filtered objects in an array

Question

I want to filter the items array objects which match the "model" key in the models array and store them in an array. I did succeed in my attempt but I am not very satisfied with my effort. Are there any better ways of doing it?

Any suggestions on how to do it using underscore.js and lodash? Or using the native javascript map and filter functions?

The JSON object

 {
"items": [
  {
    "model": "ooc0d",
    "code": "2x4qr",
    "price": 33
  },
  {
    "model": "ruie9",
    "code": "2f6gi",
    "price": 22
   },
  {
    "model": "aqu0d",
    "code": "2f6gi",
    "price": 21
  },
  {
    "model": "ddebd",
    "code": "2f6gi",
    "price": 25
  },
  {
    "model": "ddebd",
    "code": "2f6gi",
    "price": 29
  }
],
"models": [
  {
    "model": "ruie9",
    "year": 1998
  },
  {
    "model": "ooc0d",
    "year": 1991
  },
  {
    "model": "aqu0d",
    "year": 1994
  },
  {
    "model": "ddebd",
    "year": 1995
  },
  {
    "model": "odq76",
    "year": 1999
  }
]
}

My Solution

const { models, items } = jsonData;

const newarray = [];

for(let i = 0; i < models.length; i++) {
   for(let j = 0; j < items.length; j++) {
     if(items[j].model===models[i].model) {

       let obj = {
         ...items[j],
         year: models[i].year
       }
       newarray.push(obj);
    }
   }
 }

in your code you access the id property but there is not track of id property in your JSON — quirimmo
– quirimmo, Commented May 31, 2017 at 22:23
@created this benchmark with me Umair and Pankaj. Pankaj wins :) — Karen Grigoryan
– Karen Grigoryan, Commented May 31, 2017 at 23:06

Umair · Accepted Answer · 2017-05-31 22:34:33Z

3

I would take a slightly different approach. I guess you might like it.

 const models = [
      {
        "model": "ruie9",
        "year": 1998
      },
      {
        "model": "not-found",
        "year": 1991
      },
      {
        "model": "aqu0d",
        "year": 1994
      },
      {
        "model": "ddebd",
        "year": 1995
      },
      {
        "model": "odq76",
        "year": 1999
      }
    ];
    
    const items = [
      {
        "model": "ooc0d",
        "code": "2x4qr",
        "price": 33
      },
      {
        "model": "ruie9",
        "code": "2f6gi",
        "price": 22
       },
      {
        "model": "aqu0d",
        "code": "2f6gi",
        "price": 21
      },
      {
        "model": "ddebd",
        "code": "2f6gi",
        "price": 25
      },
      {
        "model": "ddebd",
        "code": "2f6gi",
        "price": 29
      }
    ];
    
    
    
    const transformed = models.reduce((res, val) => {
      res[val.model] = val;
      
      return res;
    }, {}); // Transform models into a dictionary.
    
    
    const filtered = items.filter(i => i.model in transformed);
    
    console.log(filtered);

answered May 31, 2017 at 22:34

Umair

6,3067 gold badges32 silver badges49 bronze badges

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

3 Comments

Umair Over a year ago

@1033 Glad I could help.

Umair Over a year ago

Also, by using this approach you just have to loop through the models list once instead of looping through it on every iteration.

Umair Over a year ago

@KarenGrigoryan Well that's interesting :)

Pankaj Shukla · Accepted Answer · 2017-05-31 22:45:13Z

2

You could do this:

I thought you wanted to add the year from models array too. If so, look at this implementation. This is more efficient O(n) than O(n*n) solution that you attempted earlier. For large arrays O(n*n) is not preferred.

let items = [{
    "model": "ooc0d",
    "code": "2x4qr",
    "price": 33
  },
  {
    "model": "ruie9",
    "code": "2f6gi",
    "price": 22
  },
  {
    "model": "aqu0d",
    "code": "2f6gi",
    "price": 21
  },
  {
    "model": "ddebd",
    "code": "2f6gi",
    "price": 25
  },
  {
    "model": "ddebd",
    "code": "2f6gi",
    "price": 29
  }
];

let models = [
  {
    "model": "ruie9",
    "year": 1998
  },
  {
    "model": "ooc0d",
    "year": 1991
  },
  {
    "model": "aqu0d",
    "year": 1994
  }
];

let objModels = models.reduce(function(r,v) {
 r[v.model] = v;
 return r;
}, {});

let objItems = items.reduce(function(r,v) {
 r[v.model] = v;
 return r;
}, {});

let ans = [];
for(let key in objItems) {
   if(key in objModels) {
   let o = objItems[key];
   o.year = objModels[key].year;
    ans.push(o);
    
   }
}

console.log(ans);

answered May 31, 2017 at 22:45

Pankaj Shukla

2,6722 gold badges13 silver badges18 bronze badges

3 Comments

Umair Over a year ago

Great! Can you explain how my solution complexity is O(n*n)?

Pankaj Shukla Over a year ago

@Umair When did I say yours was O(n*n)? It was for OP. However, yours is not even the solution that OP was looking for. He wanted year to be attached too. Look at OP's attempted solution for line year: models[i].year.

Pankaj Shukla Over a year ago

@KarenGrigoryan Thanks! Thanks for setting up the fiddle too!

glhrmv · Accepted Answer · 2017-05-31 22:21:49Z

1

You can rewrite

let obj = {
  ...items[j],
  year: models[i].year
}

as

let obj = Object.assign({}, items[j], { year: models[i].year });

And you can also use Array.prototype.forEach instead of a for loop, like so

models.forEach((m) => {
  items.forEach((i) => {
    if (m.id === i.id) {
      let obj = Object.assign({}, i, { year: m.year });

      newArray.push(obj);
    } 
  })
})

I tried to keep it as similar to your solution as possible.

answered May 31, 2017 at 22:21

glhrmv

1,7821 gold badge17 silver badges24 bronze badges

Comments

Karen Grigoryan · Accepted Answer · 2017-05-31 22:29:26Z

1

Try this snippet:

const jsonData = {
  "items": [{
      "model": "ooc0d",
      "code": "2x4qr",
      "price": 33
    },
    {
      "model": "ruie9",
      "code": "2f6gi",
      "price": 22
    },
    {
      "model": "aqu0d",
      "code": "2f6gi",
      "price": 21
    },
    {
      "model": "ddebd",
      "code": "2f6gi",
      "price": 25
    },
    {
      "model": "ddebd",
      "code": "2f6gi",
      "price": 29
    }
  ],
  "models": [{
      "model": "ruie9",
      "year": 1998
    },
    {
      "model": "ooc0d",
      "year": 1991
    },
    {
      "model": "aqu0d",
      "year": 1994
    },
    {
      "model": "ddebd",
      "year": 1995
    },
    {
      "model": "odq76",
      "year": 1999
    }
  ]
};

var newArray = jsonData.models.reduce(
  (acc, modelData) => {
    let filteredItems = jsonData.items.filter(item => item.model === modelData.model);
    if (filteredItems.length) {
      acc.push(...filteredItems);
    }
    return acc;
  }, [])

console.log(newArray);

answered May 31, 2017 at 22:29

Karen Grigoryan

5,4622 gold badges24 silver badges38 bronze badges

5 Comments

1033 Over a year ago

Thanks man :) May I know what does the [ ] do in the end of the reduce function?

Umair Over a year ago

Well this is a much cleaner solution, but you are running filter on each iteration which IMO is exhaustive.

Karen Grigoryan Over a year ago

@1033 always welcome. [] is the initial value of acc, it's optional if you omit it, then the first value of acc will be the first element of jsonData.models.

Karen Grigoryan Over a year ago

@Umair interesting, but I intentionally use filter because every model has 1 to many relationship with items, so every model can have several items linked to it, that's why I filter those items on every model. If you have better suggestion please feel free to edit or add your variant.

Umair Over a year ago

@KarenGrigoryan I totally understand your use of filter and I am not saying its wrong. Please check my answer with my preferred approach and please share your thoughts too.

Collectives™ on Stack Overflow

Filter nested JSON object with multiple arrays and store the filtered objects in an array

4 Answers 4

3 Comments

3 Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

3 Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related