CODEWITHSUNDEEP
javascript
Mijeong Won
Mijeong Won

Reputation: 361

Javascript compare two arrays in map function

I have two arrays and I'm trying to make a list which is like,

what fruits John, Gaby have got? list. xD

John and Gaby have their own id each and compare those two ids to the Array, Fruits. when fruitId matches to John or Gaby's juiceId, Its John or Gaby's fruits.

John : apple, orrange

Gaby : mango

Fruits = [
  {fruitId: 'abc', name: 'apple'},
  {fruitId: 'abc', name: 'orange'},
  {fruitId: 'def', name: 'mango'},
  {fruitId: 'egt', name: 'pineapple'}
]

Juices = [
  {juiceId: 'abc', customer: 'John'},
  {juiceId: 'def', customer: 'Gaby'}
]

I think it would be something like this??

array.map((list) => {
   <div>// customer's name {list.customer}</div>
   <div>// fruit's name {list.name}</div>
})

Upvotes: 0

Views: 10802

Answers (4)

Akrion
Akrion

Reputation: 18525

If I understand your question you can reduce the Juices and filter the Fruits:

const Fruits = [ {fruitId: 'abc', name: 'apple'}, {fruitId: 'abc', name: 'orange'}, {fruitId: 'def', name: 'mango'}, {fruitId: 'egt', name: 'pineapple'} ]
const Juices = [ {juiceId: 'abc', customer: 'John'}, {juiceId: 'def', customer: 'Gaby'} ]

const r = Juices.reduce((r, {customer, juiceId}) => {
 r[customer] = Fruits.filter(y => y.fruitId == juiceId).map(x => x.name).join(',')
 return r
}, {})

console.log(r)
console.log('John:', r.John)
console.log('Gaby:', r.Gaby)

Upvotes: 2

AnonymousSB
AnonymousSB

Reputation: 3594

Your question isn't exactly clear, but this is the best I could comprehend from what you're trying to ask.

function findFruits() {
  var fruits = [
    {fruitId: 'abc', name: 'apple'},
    {fruitId: 'abc', name: 'orange'},
    {fruitId: 'def', name: 'mango'},
    {fruitId: 'egt', name: 'pineapple'}
  ];

  var juices = [
    {juiceId: 'abc', customer: 'John'},
    {juiceId: 'def', customer: 'Gaby'}
  ];
  var target = document.getElementById('target');
  var div = document.createElement('div');

  juices.forEach(juice => {
    var p = document.createElement('p');
    var string = `${juice.customer} likes`;
    var matches = fruits.filter(fruit => fruit.fruitId === juice.juiceId);

    matches.forEach(match => string += ` ${match.name}`);
    p.innerHTML = string;
    div.appendChild(p);
  });
  
  target.appendChild(div);
}

findFruits();
<section id="target"></section>

Upvotes: 0

Phil
Phil

Reputation: 165070

First thing you're going to want is a quick way to reference fruit by fruitId. A Map of ids to a collection of fruit names would be perfect for this.

To create this, use Array.prototype.reduce().

const fruitMap = Fruits.reduce((map, { fruitId, name }) => {
  let fruit = map.get(fruitId) || []
  fruit.push(name)
  return map.set(fruitId, fruit)
}, new Map())

then you can map your Juices array to something more like your desired output

const array = Juices.map(({ juiceId, customer }) => ({
  customer,
  name: (fruitMap.get(juiceId) || []).join(', ')
}))


const Fruits =[{"fruitId":"abc","name":"apple"},{"fruitId":"abc","name":"orange"},{"fruitId":"def","name":"mango"},{"fruitId":"egt","name":"pineapple"}]

const Juices = [{"juiceId":"abc","customer":"John"},{"juiceId":"def","customer":"Gaby"}]

const fruitMap = Fruits.reduce((map, { fruitId, name }) => {
  let fruit = map.get(fruitId) || []
  fruit.push(name)
  return map.set(fruitId, fruit)
}, new Map())

const array = Juices.map(({ juiceId, customer }) => ({
  customer,
  name: (fruitMap.get(juiceId) || []).join(', ')
}))

console.info(array)

Upvotes: 4

udarabibile
udarabibile

Reputation: 503

Here's pretty simple and understandable approach for this scenario. There could be easy ways to achieve this goal, but this is pretty readable even with and doesn't need advanced javascript approaches.

  const Fruits = [
    {fruitId: 'abc', name: 'apple'},
    {fruitId: 'abc', name: 'orange'},
    {fruitId: 'def', name: 'mango'},
    {fruitId: 'egt', name: 'pineapple'}
  ]

  const Juices = [
    {juiceId: 'abc', customer: 'John'},
    {juiceId: 'def', customer: 'Gaby'}
  ]

  let finalArray = []
  Juices.map((juice) => {
    Fruits.map((fruit) => {
      if(juice.juiceId === fruit.fruitId){
        finalArray.push({customer: juice.customer, fruit: fruit.name}) 
      }
    });
  });

  console.log(finalArray)

Upvotes: 0

Related Questions