How can I filter 2 object arrays in React?

Question

const obj1 = [{'food': ['apple'], 'drink': ['wine', 'juice']}];

const obj2 = [{id: 1, 'food': ['apple'], dummy: 'test', 'drink':['wine', 'juice']}, 
              {id: 2, 'food': 'banana', dummy: 'test', 'drink':['juice']},
              {id: 3, 'food': ['apple', 'banana'], dummy: 'test'},'drink':['juice']}
              ];


//and result should be like this
const result = [{id:1, 'food': ['apple'], 'drink': ['wine', 'juice']}];

if there's two object arrays, how can I filter obj1 on obj2? What I'm going to do is

if obj1 has same value with obj2, leave obj2's objects that contains same value with obj1.
set the state with those remained objects.

this is how I tried.
the problem of this logic is
returned value contains only filtered value.
ex) {food:['banana]}
but It has to return all object that contain 'banana', not only 'banana'.
(so that I can set State with filtered result)

//key arg is recived key from outside. (it should be 'food' or 'drink')

const showFilteredRes = (obj1, key) => {
    let filteredRes = {};

    obj2.forEach((obj2) => {
      for (let filters in obj1) {
        for (let infos in obj2) {
          if (filters === infos) {
            filteredRes[infos] = obj2[key];
            console.log(filteredRes);
          }
        }
      }
    });
  };

how can I develop this code?

I edited my example because my explanation was too poor.

You should give some examples of inputs and desired outputs to make it clearer — Vinicius
– Vinicius, Commented Mar 8, 2021 at 18:57

Ram Sankhavaram · Accepted Answer · 2021-03-08 19:17:38Z

1

const obj1 = [{
  'food': ['banana'],
  'drink': ['wine', 'juice']
}];

const obj2 = [{
    id: 1,
    'food': ['apple', 'custard'],
    dummy: 'test',
    'drink': ['wine', 'juice']
  },
  {
    id: 2,
    'food': ['banana'],
    dummy: 'test',
    'drink': ['juice']
  },
  {
    id: 3,
    'food': ['apple', 'banana'],
    dummy: 'test',
    'drink': ['juice', 'wine']
  }
];


const showFilteredRes = (filtered, key) => {
  let result = [];
  filtered.forEach((filteredObj) => {
    obj2.forEach((obj) => {
      if (JSON.stringify(obj[key]) == JSON.stringify(filteredObj[key])) {
        result.push(obj);
      }
    })
  })
  console.log(result);
};

showFilteredRes(obj1, "food");

Looping though the first Object and acquire the desired object using the deep compare arrays with same key.

answered Mar 8, 2021 at 19:17

Ram Sankhavaram

1,2388 silver badges13 bronze badges

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

Comments

Rohan Agarwal · Accepted Answer · 2021-03-08 18:29:08Z

0

Make use of some() :

const showFilteredRes = (filtered, key) => {
    let filteredRes = {};
    obj2.forEach(entry => {
    if(entry[key].some(item => obj1[key].includes(item)))
    {
        console.log(filteredRes);
    }
 }

answered Mar 8, 2021 at 18:29

Rohan Agarwal

2,6093 gold badges20 silver badges37 bronze badges

4 Comments

bonlim Over a year ago

I think some() is not a good way in this case. because It returns true when It found matched value. but In my case, even the method found the matched case, It still has to search until array ends

Rohan Agarwal Over a year ago

Why do you think so? Please provide reasons.

bonlim Over a year ago

first of all, some() returns boolean type of data. but I need filtered object. and secondly, let me say If I put 'apple' for keyword and there's 5 object arrays to search. but If first object array has 'apple' value then some() method

bonlim Over a year ago

would stop searching and return true.

Collectives™ on Stack Overflow

How can I filter 2 object arrays in React?

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related