Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Return all arrays which contains a string within its array

I am trying to filter out the objects which contains a string among on of its array. I have it inside an array of objects.

I have this:

[
{      
  articles: {
    id: "1",
    title: "Great food article",
    featured: false,
    paid: false,
    image: img1,
    author: "Chocolate Boy",
    date:"1-2-2020",
    description:
      "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
    tags: [
      "Tech",
      "Food"
    ]
  }
},
{      
    articles: {
      id: "2",
      title: "Good tech article",
      featured: false,
      paid: false,
      image: img2,
      author: "Candy Boy",
      date:"1-2-2020",
      description:
        "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
      tags: [
        "Tech",
        "Adventure"
      ]
    }
  },
  {      
    articles: {
      id: "3",
      title: "Nice adventure article",
      featured: false,
      paid: false,
      image: img3,
      author: "Lollypop Boy",
      date:"1-2-2020",
      description:
        "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
      tags: [
        "Tech",
        "Food",
        "Adventure"
      ]
    }
  },
]

I want to return both the objects which contains "food" in their "tags" array If I compare a string of "food".

filterArticles = () =>{
    let{
        articles, tags
    } = this.state

    let tempArticles = [...articles];
    console.log(tempArticles)
    //Making array of arrays of articles tags
    let array1 = [...new Set(tempArticles.map(item => item["tags"]))];
    //Making the array of arrays flat to one dimensional array
    let array2 = [...new Set(array1.flat(1))];
    console.log(array2)
    console.log(tags)

}

Where tempArticles has all the 3 objects and tags has a value of food but its only returning an array of all the 3 tags in an array.

Expecting 1 and the 3 objects.

Help with explanation appreciated as I am trying to figure it out for a while.

like image 351
H_alt Avatar asked Sep 05 '26 22:09

H_alt


1 Answers

You can use Array.prototype.filter() and then String.prototype.includes() to check if string is included in tags array or not.

var array = [
{      
  articles: {
    id: "1",
    title: "Great food article",
    featured: false,
    paid: false,
    image: '',
    author: "Chocolate Boy",
    date:"1-2-2020",
    description:
      "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
    tags: [
      "Tech",
      "Food"
    ]
  }
},
{      
    articles: {
      id: "2",
      title: "Good tech article",
      featured: false,
      paid: false,
      image: '',
      author: "Candy Boy",
      date:"1-2-2020",
      description:
        "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
      tags: [
        "Tech",
        "Adventure"
      ]
    }
  },
  {      
    articles: {
      id: "3",
      title: "Nice adventure article",
      featured: false,
      paid: false,
      image: '',
      author: "Lollypop Boy",
      date:"1-2-2020",
      description:
        "Street art edison bulb gluten-free, tofu try-hard brooklyn tattooed pickled chambray. Actually humblebrag next level, deep v art party wolf tofu direct trade readymade sustainable hell of banjo. Organic authentic subway tile cliche palo santo, street art XOXO dreamcatcher retro sriracha portland air plant kitsch stumptown. Austin small batch squid gastropub. Pabst pug tumblr gochujang offal retro cloud bread bushwick semiotics before they sold out sartorial literally mlkshk. Vaporware hashtag vice, sartorial before they sold out pok pok health goth trust fund cray.",
      tags: [
        "Tech",
        "Food",
        "Adventure"
      ]
    }
  }
]

var foodArray = array.filter(value => value.articles.tags.includes('Food'));
console.log(foodArray);
like image 70
Sudhir Ojha Avatar answered Sep 07 '26 12:09

Sudhir Ojha



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!