Question 36307 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Filter 2 arrays to check if parent child – Jquery

I have first array –

let parent = [
    {
     id:1,
     value:"ABC",
    },
    {
     id:2,
     value:"DEF",
    },
    {
     id:3,
     value:"GHI",
    },
    {
     id:4,
     value:"JKL",
    },
    {
     id:5,
     value:"MNO",
    },
    {
     id:6,
     value:"PQR",
    },
    ]

And 2nd Array Object –

let child = [
{
 childid:1,
 value:"ABC",
},
{
 childid:2,
 value:"DEF",
},
{
 childid:10,
 value:"GHI",
},
]

From parent array I want to select all those elements whose id matches with childid from child array.

I tried –

parent.filter(x=>x.id==child.each(y=>y.childid))

But its not working

Tags:

5

Answers


  1. 0

    You can use some() to do it

    let parent = [
    {
     id:1,
     value:"ABC",
    },
    {
     id:2,
     value:"DEF",
    },
    {
     id:3,
     value:"GHI",
    },
    {
     id:4,
     value:"JKL",
    },
    {
     id:5,
     value:"MNO",
    },
    {
     id:6,
     value:"PQR",
    },
    ]
 
 let child = [
{
 childid:1,
 value:"ABC",
},
{
 childid:2,
 value:"DEF",
},
{
 childid:10,
 value:"GHI",
},
]


let result = parent.filter(p => child.some(a =>  a.childid == p.id ))
console.log(result)
    Login or Signup to reply.
  2. 0

    using Flatmap and filter …

    let parent = [{
    id: 1,
    value: "ABC",
  },
  {
    id: 2,
    value: "DEF",
  },
  {
    id: 3,
    value: "GHI",
  },
  {
    id: 4,
    value: "JKL",
  },
  {
    id: 5,
    value: "MNO",
  },
  {
    id: 6,
    value: "PQR",
  },
]
let child = [{
    childid: 1,
    value: "ABC",
  },
  {
    childid: 2,
    value: "DEF",
  },
  {
    childid: 10,
    value: "GHI",
  },
]
const res = parent.flatMap(x => child.filter(y => y.childid === x.id))
console.log(res)
    Login or Signup to reply.
  3. 0 
    const filterResult = parent.filter(x => child.some(y => y.childid == x.id))
    Login or Signup to reply.
  4. 0

    This would work

    parent.filter(p => child.some(c => c.childid === p.id))

    Wat happens is

    1. For each element in parent array, find the corresponding element in the child array
    2. If it exists the filter will see it as truthy and keep the parent element, if not it will be falsy and filter wil discard it

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

    Login or Signup to reply.
  5. 0

    You can use a reduce function along with a forEach to loop through the child elements and compare against the parent.

    const result = parents.reduce((acc, parent) => {
  children.forEach((child) => {
    if (parent.id === child.childid) {
      acc.push(parent);
    }
  });

  return acc;
}, []);

console.log(result); // [{"id":1,"value":"ABC"},{"id":2,"value":"DEF"}]

    const parents = [{
    id: 1,
    value: 'ABC',
  },
  {
    id: 2,
    value: 'DEF',
  },
  {
    id: 3,
    value: 'GHI',
  },
  {
    id: 4,
    value: 'JKL',
  },
  {
    id: 5,
    value: 'MNO',
  },
  {
    id: 6,
    value: 'PQR',
  },
];

const children = [{
    childid: 1,
    value: 'ABC',
  },
  {
    childid: 2,
    value: 'DEF',
  },
  {
    childid: 10,
    value: 'GHI',
  },
];

const result = parents.reduce((acc, parent) => {
  children.forEach((child) => {
    if (parent.id === child.childid) {
      acc.push(parent);
    }
    return acc;
  });

  return acc;
}, []);

console.log(result);

    MDN Reduce

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search