INNER JOIN in Javascript

Question

const products = [{
    id: 5,
    productName: "Logitech Mouse",
    unitprice: 35
  },
  {
    id: 6,
    productName: "Logitech Keyboard",
    unitprice: 40
  }
];

const cart = [{
    id: 101,
    userId: 3,
    productId: 5,
    quantity: 2
  },
  {
    id: 102,
    userId: 3,
    productId: 6,
    quantity: 1
  }
];

With these data in the objects, how do I inner join cart's productId to product's id? So that the output will be :

Logitech Mouse, 35, 2 Logitech Keyboard, 40, 1

cart.forEach(item=>item.product = products.find(product=>product.id === item.productId)); Done. — Niet the Dark Absol
– Niet the Dark Absol, Commented Mar 17, 2020 at 6:48
What do you mean with INNER JOIN in JS? There is no inner join. You want to solve this with usual code or are you using some library or database or something? You could use the comment above or for better performance us a map to store the values or use LINQ for JS. This would be more like SQL with JS: github.com/mihaifm/linq. — Stefan Rein
– Stefan Rein, Commented Mar 17, 2020 at 6:48

Mamun · Accepted Answer · 2020-03-17 13:22:46Z

2

I will request you to try yourself first before asking for help to get the help from the community in the best possible way.

You can try using .map() and find() with Destructuring assignment:

const products = [{
    id: 5,
    productName: "Logitech Mouse",
    unitprice: 35
  },
  {
    id: 6,
    productName: "Logitech Keyboard",
    unitprice: 40
  }
];

const cart = [{
    id: 101,
    userId: 3,
    productId: 5,
    quantity: 2
  },
  {
    id: 102,
    userId: 3,
    productId: 6,
    quantity: 1
  }
];

var res = products.map(({id,...rest}) => {
  var cartObj = cart.find(c => c.productId == id);
  rest.quantity = (cartObj != undefined && 'quantity' in  cartObj) ? cartObj.quantity : 'N/A';
  return rest;
});
console.log(res);

edited Mar 17, 2020 at 13:22

answered Mar 17, 2020 at 6:52

Mamun

69k9 gold badges51 silver badges62 bronze badges

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

3 Comments

Steve Over a year ago

Can explain a bit how ` rest.quantity = cart.find(c => c.productId == id).quantity;` works? I thought quantity is directly get from cart without any calculation?

Mamun Over a year ago

@Steve, actually that statement is finding the object from the other array (cart) by matching the property value of id and productId, once found the object from cart, getting the property value of quantity which is assigned to rest.quantity:)

Steve Over a year ago

When there is only one object in cart, it throws error Uncaught TypeError: Cannot read property 'quantity' of undefined

Nina Scholz · Accepted Answer · 2020-03-17 13:43:10Z

1

You could take a more SQL like approach crating a hash table for the products and map cart with the wanted properties from the object from the hash table and quantity

As result, you get new objects with product name, unit price and quantity.

const
    select = (keys, object) => Object.fromEntries(keys.map(k => [k, object[k]])),
    products = [{ id: 5, productName: "Logitech Mouse", unitprice: 35 }, { id: 6, productName: "Logitech Keyboard", unitprice: 40 }],
    cart = [{ id: 101, userId: 3, productId: 5, quantity: 2 }, { id: 102, userId: 3, productId: 6, quantity: 1 }],
    productsMap = products.reduce((r, o) => (r[o.id] = o, r), {}),
    result = cart.map(({ productId, quantity }) => ({ 
        ...select(['productName', 'unitprice'], productsMap[productId]),
        quantity
    }));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Mar 17, 2020 at 13:43

answered Mar 17, 2020 at 8:02

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

4 Comments

Steve Over a year ago

What if I just want the quantity directly from carts without any computation?

Nina Scholz Over a year ago

then you need to collect the totals first.

Steve Over a year ago

if I have only one object in my cart, it still print two rows

Nina Scholz Over a year ago

please see edit. it was not clear, which direction you had.

Collectives™ on Stack Overflow

INNER JOIN in Javascript

2 Answers 2

3 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related