Home > OS >  How to filter Array in an object
How to filter Array in an object

Time:01-15

I have these arrays in my object and I need to filter tags array with a specific value. I am not sure how to achieve this

const obj = [
    {
        "slug": "add-an-aggregate-rating-feature-to-your-website",
        "frontmatter": {
            "title": "Add An Aggregate Rating Feature To Your Website",
            "metaTitle": "Add An Aggregate Rating Feature To Your Website",
            "tags": [
                "structured-data",
                "aggregate-rating",
                "rich-text"
            ]
        }
    },
    {
        "slug": "step-by-step-guide-to-become-a-full-stack-web-developer-in-2023",
        "frontmatter": {
            "title": "Step-by-Step Guide: How to Become a Full Stack Web Developer in 2023",
            "metaTitle": "Step-by-Step Guide: How to Become a Full Stack Web Developer"
            "tags": [
                "article",
                "roadmap"
            ]
        }
    },
    {
        "slug": "what-is-dall-e",
        "frontmatter": {
            "title": "What is DALL-E? A world changing technology?",
            "metaTitle": "What is DALL-E? A world changing technology?"
            "tags": [
                "technology",
                "article",
                "openai"
            ]
        }
    }
]

// List objects having article tag only
var newArray = obj.filter(function (el){
    return el.frontmatter.tags.filter(function (el2){
         el2 == "article"
    })
})
console.log(newArray)

CodePudding user response:

I'm pretty sure that you want to filter the obj array

const newArray = obj.filter((el) =>
  el.frontmatter.tags.includes("article")
)

const obj = [{
    "slug": "add-an-aggregate-rating-feature-to-your-website",
    "frontmatter": {
      "title": "Add An Aggregate Rating Feature To Your Website",
      "metaTitle": "Add An Aggregate Rating Feature To Your Website",
      "tags": [
        "structured-data",
        "aggregate-rating",
        "rich-text"
      ]
    }
  },
  {
    "slug": "step-by-step-guide-to-become-a-full-stack-web-developer-in-2023",
    "frontmatter": {
      "title": "Step-by-Step Guide: How to Become a Full Stack Web Developer in 2023",
      "metaTitle": "Step-by-Step Guide: How to Become a Full Stack Web Developer",
      "tags": [
        "article",
        "roadmap"
      ]
    }
  },
  {
    "slug": "what-is-dall-e",
    "frontmatter": {
      "title": "What is DALL-E? A world changing technology?",
      "metaTitle": "What is DALL-E? A world changing technology?",
      "tags": [
        "technology",
        "article",
        "openai"
      ]
    }
  }
]

const newArray = obj.filter((el) =>
  el.frontmatter.tags.includes("article")
)

console.log(newArray)

CodePudding user response:

Use filter and includes for an elegant one-liner

const obj = [
    {
        "slug": "add-an-aggregate-rating-feature-to-your-website",
        "frontmatter": {
            "title": "Add An Aggregate Rating Feature To Your Website",
            "metaTitle": "Add An Aggregate Rating Feature To Your Website",
            "tags": [
                "structured-data",
                "aggregate-rating",
                "rich-text"
            ]
        }
    },
    {
        "slug": "step-by-step-guide-to-become-a-full-stack-web-developer-in-2023",
        "frontmatter": {
            "title": "Step-by-Step Guide: How to Become a Full Stack Web Developer in 2023",
            "metaTitle": "Step-by-Step Guide: How to Become a Full Stack Web Developer",
            "tags": [
                "article",
                "roadmap"
            ]
        }
    },
    {
        "slug": "what-is-dall-e",
        "frontmatter": {
            "title": "What is DALL-E? A world changing technology?",
            "metaTitle": "What is DALL-E? A world changing technology?",
            "tags": [
                "technology",
                "article",
                "openai"
            ]
        }
    }
];

const newArray = obj.filter(el => el.frontmatter.tags.includes("article"));
console.log(newArray);

CodePudding user response:

Hope this helps..

const blogs = [
  {
    "slug": "add-an-aggregate-rating-feature-to-your-website",
    "frontmatter": {
      "title": "Add An Aggregate Rating Feature To Your Website",
      "metaTitle": "Add An Aggregate Rating Feature To Your Website",
      "tags": [
        "structured-data",
        "aggregate-rating",
        "rich-text"
      ]
    }
  },
  {
    "slug": "step-by-step-guide-to-become-a-full-stack-web-developer-in-2023",
    "frontmatter": {
      "title": "Step-by-Step Guide: How to Become a Full Stack Web Developer in 2023",
      "metaTitle": "Step-by-Step Guide: How to Become a Full Stack Web Developer",
      "tags": [
        "article",
        "roadmap"
      ]
    }
  },
  {
    "slug": "what-is-dall-e",
    "frontmatter": {
      "title": "What is DALL-E? A world changing technology?",
      "metaTitle": "What is DALL-E? A world changing technology?",
      "tags": [
        "technology",
        "article",
        "openai"
      ]
    }
  }
]

// List objects having article tag only
const blogsWithTag = blogs.filter((blog) => 
    blog.frontmatter?.tags.includes("article"))

  • Related