3

How would I get the name of an item from an array such as the one below, using an id? I have tried by using the .find function in javascript but it returns an undefined response.

{
    "products": [
        {
            "name": "Blue T-Shirt",
            "price": 25.99,
            "description": "A lovely t-shirt.",
            "image": "tshirt.png",
            "id": 1
        },
        {
            "name": "Beige",
            "price": 16.49,
            "description": "Some nice beige pants.",
            "image": "pants.png",
            "id": 2
        },
        {
            "name": "Ugly Shirt",
            "price": 27.99,
            "description": "An ugly, gag-gift shirt.",
            "image": "shirt.png",
            "id": 3
        }
    ]
}

and this is how I am finding it:

var slug = req.params.product;

var item = products.find(products => products.id === slug).name;

console.log(item);

Thanks in advance!

PointyKone
  • 133
  • 2
  • 9
  • You should first go inside the object, then `products.find(...)` since you have `{..}` around the `products` array – Merim Dec 29 '20 at 13:08
  • what exactly is that object? Unsure what slug's value is and what product is. We need more context (details) to help you out. The code works fine when I make assumptions, it is hard to know what assumption I madre that is incorrect which causes you to have the code fail. Is slug `3` or `"3"`? – epascarello Dec 29 '20 at 13:10
  • It's a JSON, so you have to parse it first. – Damian Kociszewski Dec 29 '20 at 13:10
  • 1
    Your code is fine in general terms, you probably got the details wrong. Is `req.params.product` a number or a string? What does the `products` variable contain exactly? – Álvaro González Dec 29 '20 at 13:14
  • 2
    Does this answer your question? [Find object by id in an array of JavaScript objects](https://stackoverflow.com/questions/7364150/find-object-by-id-in-an-array-of-javascript-objects) – pilchard Dec 29 '20 at 13:30

1 Answers1

3

Use .find() on the products array:

const data = {"products": [{"name": "Blue T-Shirt", "price": 25.99, "description": "A lovely t-shirt.", "image": "tshirt.png", "id": 1 }, {"name": "Beige", "price": 16.49, "description": "Some nice beige pants.", "image": "pants.png", "id": 2 }, {"name": "Ugly Shirt", "price": 27.99, "description": "An ugly, gag-gift shirt.", "image": "shirt.png", "id": 3 } ] };

const idToFind = 3;

const item = data.products.find((p) => p.id === idToFind);
console.log(item);
{
  "name": "Ugly Shirt",
  "price": 27.99,
  "description": "An ugly, gag-gift shirt.",
  "image": "shirt.png",
  "id": 3
}

If you wish to 'find' an array with multiple objects, take a look at .filter.

const data = {"products": [{"name": "Blue T-Shirt", "price": 25.99, "description": "A lovely t-shirt.", "image": "tshirt.png", "id": 1 }, {"name": "Beige", "price": 16.49, "description": "Some nice beige pants.", "image": "pants.png", "id": 2 }, {"name": "Ugly Shirt", "price": 27.99, "description": "An ugly, gag-gift shirt.", "image": "shirt.png", "id": 3 } ] };

const idsToFind = [ 2, 3 ];

const item = data.products.filter((p) => idsToFind.includes(p.id));
console.log(item);
0stone0
  • 34,288
  • 4
  • 39
  • 64
  • 1
    There is a nine year old question with a near identical title and answer with more detail. You should flag as duplicate. [Find object by id in an array of JavaScript objects](https://stackoverflow.com/questions/7364150/find-object-by-id-in-an-array-of-javascript-objects) – pilchard Dec 29 '20 at 13:41