Looping through the array inside another array

Question

First array:

var products_cart = [1, 2, 2]; (these are the products_id's)

Second array:

var cart_details =
    [{
        product_id: 1,
        product_name: 'product love',
        category_name: 'love'
    },
    {
        product_id: 2,
        product_name: 'product birthday love',
        category_name: 'birthday'
    }]

I want to loop through the elements of the array products_cart and use the product_id from products_cart to render details from cart_details (loop through them I suppose), how is this possible?

EDIT:

I think some of you got me wrong, I basically want this to render something like this:

[{
    product_id: 1,
    product_name: 'product love',
    category_name: 'love'
},
{
    product_id: 2,
    product_name: 'product birthday love',
    category_name: 'birthday'
},
{
    product_id: 2,
    product_name: 'product birthday love',
    category_name: 'birthday'
}
]

My mistake, I wasn't clear enough.

there should be 3 results that use the details from cart_details — Cedric Hadjian
– Cedric Hadjian, Commented Nov 12, 2017 at 23:05

slevy1 · Accepted Answer · 2017-11-13 00:47:31Z

1

Assuming that the values of the products_cart are product id values, then you can try the following:

var products_cart = [1, 2, 2];

var cart_details = [{
    product_id: 1,
    product_name: 'product love',
    category_name: 'love'
  },
  {
    product_id: 2,
    product_name: 'product birthday love',
    category_name: 'birthday'
  }
]

for (var i=0, max=products_cart.length; i < max; i++) {
  for (var j=0, maxi = cart_details.length; j < maxi; j++) {
  
  if ( products_cart[i] == cart_details[j].product_id) {
       console.log( "product id: " + cart_details[j].product_id);
       console.log("product name: " + cart_details[j].product_name); 
       console.log("category name: " + cart_details[j].category_name,"\n\n");
      }
    
    }
  }

edited Nov 13, 2017 at 0:47

answered Nov 13, 2017 at 0:26

slevy1

3,8182 gold badges29 silver badges33 bronze badges

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

3 Comments

Cedric Hadjian Over a year ago

I want it to return 3 results, reread the question again I also edited it.

slevy1 Over a year ago

@Cedric Okay, I fixed it -- hope this works for you. It is a pure JavaScript solution.

slevy1 Over a year ago

@Cedric You're welcome; I'm glad you like my answer.

malifa · Accepted Answer · 2017-11-12 23:26:58Z

1

You could use find() while looping through your ids array:

let products = [];

products_cart.forEach(id => {
    let product = cart_details.find(detail => detail.product_id === id);

    if (product) {
       products.push(product);
    }
});

answered Nov 12, 2017 at 23:26

malifa

8,1552 gold badges44 silver badges57 bronze badges

5 Comments

malifa Over a year ago

@CedricHadjian it definitely does. but i used es6 features, might that be your problem? where do you run your code?

Cedric Hadjian Over a year ago

EJS (express.js app)

Cedric Hadjian Over a year ago

when I logged products, it returned an empty array

malifa Over a year ago

@CedricHadjian Take a look, i used your example arrays from above and the output is the one you are expecting: jsfiddle.net/h1qtfjbp/2 So maybe you have some error in your implementation.

Cedric Hadjian Over a year ago

slevy1's answer worked, check it out. Wanted something like that.

kevinSpaceyIsKeyserSöze · Accepted Answer · 2017-11-12 23:04:32Z

0

var products_cart = [1, 2, 2];
var cart_details = [{
product_id: 1,
product_name: 'product love',
category_name: 'love'
},
{
product_id: 2,
product_name: 'product birthday love',
category_name: 'birthday'
}];

products_cart.forEach(function(id){
  cart_details.forEach(function(detail){
    if(detail.product_id === id){
      console.log(detail);
    }
  });
});

answered Nov 12, 2017 at 23:04

kevinSpaceyIsKeyserSöze

4,4802 gold badges18 silver badges29 bronze badges

1 Comment

Cedric Hadjian Over a year ago

I think you got me wrong, I edited the post, check it out.

Obsidian Age · Accepted Answer · 2017-11-12 23:17:25Z

0

What I would recommend doing is looping over the products_cart with .forEach(), then checking the keys of cart_details with Object.keys(), and looping over them as well. Then you can simply check whether the two match.

You then have a collection of all objects that have a product_id that is in your products_cart, and are free to do with them as you will.

The following example simply logs the objects back to you:

var products_cart = [1, 2, 2];

var cart_details = [{
    product_id: 1,
    product_name: 'product love',
    category_name: 'love'
  },
  {
    product_id: 2,
    product_name: 'product birthday love',
    category_name: 'birthday'
  },
  {
    product_id: 3,
    product_name: 'NOT IN ARRAY products_cart',
    category_name: 'SHOULD NOT BE SHOWN'
  }
]


products_cart.forEach(function(product) {
  Object.keys(cart_details).forEach(function(key) {
    if (product === cart_details[key].product_id) {
      console.log(cart_details[key]);
    }
  });
});

I've also included a third product to demonstrate that only products in products_cart will be shown in the conditional.

Hope this helps! :)

edited Nov 12, 2017 at 23:17

answered Nov 12, 2017 at 23:04

Obsidian Age

42.5k11 gold badges54 silver badges76 bronze badges

7 Comments

Cedric Hadjian Over a year ago

I think you got me wrong, I edited the post, check it out.

Obsidian Age Over a year ago

@CedricHadjian - I've updated my answer to log product 2 twice :)

Cedric Hadjian Over a year ago

product_id is not defined :(

Obsidian Age Over a year ago

@CedricHadjian -- It is working in the above snippet. Ensure you have copied it exactly, and then build up from there to find the cause of the problem.

Cedric Hadjian Over a year ago

The thing is I'm using express.js, therefore I needed to remove Object.keys(), if I don't remove it it's not returning anything, if I remove it it's returning error (product_id is not defined). I thought this could be solved through simple for loop and there wasn't a need to note that it's an express.js application. :/

|

멍개-mung · Accepted Answer · 2017-11-12 23:31:03Z

0

Do you need list? I think using json instead of list.

var products_cart = [1, 2, 2];

var cart_details =[
{
    product_id: 1,
    product_name: 'product love',
    category_name: 'love'
},
{
    product_id: 2,
    product_name: 'product birthday love',
    category_name: 'birthday'
}];

var new_cart_details = {};

// changed list to josn
cart_details.map( item => {
    new_cart_details[item.product_id] = {
        product_name: item.product_name,
        category_name: item.category_name
    }
});

products_cart.map( item => {
    console.log(new_cart_details[item])
});

answered Nov 12, 2017 at 23:31

멍개-mung

4765 silver badges12 bronze badges

3 Comments

Cedric Hadjian Over a year ago

Yes, I do need a list, I need to loop through the result to show it in the view. This returned 3 separate objects which was what I was looking for but I need them inside an array.

멍개-mung Over a year ago

hmm. then Do you my propose is not solved. The method I suggested is also not a problem with turning the loop around

Cedric Hadjian Over a year ago

This worked with me but it's a lot longer, @slevy1's solution was simple and straight forward. Thank you for your time!

Collectives™ on Stack Overflow

Looping through the array inside another array

5 Answers 5

3 Comments

5 Comments

1 Comment

7 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

5 Comments

1 Comment

7 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related