How do I access objects in items array in javascript

Question

How do I access the value of the objects inside of the 'items' property

 [
  {
    _id: 61b6fb289ef81937305ea137,
    name: 'Apples',
    user: 61b5d787aa22ab26e3f8d0bb,
    items: [ [Object], [Object], [Object], [Object], [Object] ],
    __v: 5
  }
]

This is the code I wrote inside a get route that allowed me to get to where I am now. I just need to be able to get ahold of the value within the items property.

 const custom = _.capitalize(req.params.customList);
    const list = await List.find({name:custom, user:{$eq: req.user._id}});

Edit:

Thank you all for your help. After some more digging, trial and error, a nap, and some Lo-fi music I figured out the issue and how to fix it. The reason why I wanted to access the item in the array was so that I can iterate through the contents and present it on the from end. The main issue I was having was that every time I saved an item into a list it would not appear in the wrong list in both the DB and the front end.

I spent a majority of my time believing that this code was the issue

router.get('/:customList', auth, async(req, res)=>{
    const custom = _.capitalize(req.params.customList);

    const list = await List.findOne({name:custom, user:{$eq: req.user._id}});
  
    if(!list)
    {
      const newList = new List({
        name:custom,
        user:req.user._id,
      });

      newList.save();
      res.redirect('/'+custom)
    }
    else{
      res.render('home',{
        listTitle:custom, newListItems: list.items
      })
    }
});

But in actuality, it was this one

router.post("/home", auth, async(req, res)=>{

    const {newItem, list} = req.body;
   
    const item = new Item({
        name: newItem,
        user: req.user._id
        
    });
  
    if(list === req.user.username){
      
      item.save();
  
      res.redirect('/home');
    }else{
      
      // The was causing the issue
      const result = await List.findOne({name:list})

      result.items.push(item);

      result.save();

      res.redirect('/'+list);
    } 
  });

const result = await List.findOne({name:list}) would find the first list that matches and add the item into the array even though they could be multiple list names that matched.

I fixed it with this const result = await List.findOne({name:list, user:{$eq:req.user._id});. This took me three days to figure out and I'm just excited to finally figure it out. Sorry for the long post.

`list[0].items`? I'm guessing `list` is the array you showed initially. Destructuring is another option `const [{items}] = list;`, then you can use `items` as a variable that stores your array — Nick Parsons, Dec 13 '21 at 09:04
the response i got was from the terminal I was accessing a collection within my MongoDB called List via the mongoose find method and it returned the content above. The findOne method allows me to simply write ` list.item` which allows me to access the content but the Find does something else that I don't understand. — Alex Antoine, Dec 13 '21 at 09:07
What are you expecting as your result for when you get multiple objects in your array rather than just one? Why not use `.findOne()` (if you only expect one item)? — Nick Parsons, Dec 13 '21 at 09:08
because findOne return the first one that it finds in the order. There may be multiple lists that have the same name. — Alex Antoine, Dec 13 '21 at 15:40

score 2 · Answer 1 · answered Dec 13 '21 at 09:06

2

// ...
const [{items}] = list; // destructure `items` property on first array element, same as: const items = list[0].items;
console.log(items); // array of objects

answered Dec 13 '21 at 09:06

jsejcksn

27,667
4
38
62

That worked until the array was empty which resulted in it not being able to render on the front end. I figured out the issue. My post route was using the `findOne` function but was only looking for the name that match instead of the name and user id. Thanks for your answer. – Alex Antoine Dec 14 '21 at 05:59

How do I access objects in items array in javascript

1 Answers1