Filtering nested objects in JavaScript up to a specific level

Question

Filtering nested objects in JavaScript up to a specific level

I need to implement a filter for an array of nested objects in JavaScript.

After researching, I found the following solution from another source.

var sampleData= [{       
        "rowId": "3.0.0",
        "startDate": "2020-10-20",
        "subTasks": [                 
            {                
                "rowId": "3.3.0",
                "startDate": "2021-05-26",             
                "subTasks": [
                    {
                        "rowId": "3.3.0.1",
                        "startDate": "2021-05-26",                        
                        "subTasks": []
                    },
                    {
                        "rowId": "3.3.0.2",
                        "startDate": "2021-06-09",
                        "endDate"": "2021-07-23",
                        "subTasks"]<span></span>: []                      
                    },                   
                ]
            },           
        ]
    }]

    filtered = sampleData.map(element => {
        return {
          ...element,
          subTasks: element.subTasks.filter(subElement => {
            return subElement.endDate
          })
        }
      })  
      console.log("sampleData",JSON.stringify(filtered))

The goal is to filter based on the end date. Expected result: Object with rowId "3.3.0.2" should be filtered out.

This current implementation only filters up to 2 levels deep. However, considering that my nested objects can extend up to 10 levels, how can I apply this filtering across any number of levels?

javascript arrays filter underscore.js

Answer 1

Answer №1

If you want to achieve this, you can utilize a recursive function that loops through only the valid subtasks. Assuming you are familiar with how recursive functions work, here is an example:

function filterSubTasks(elem) {
  const filteredSubTasks = elem.subTasks
    .filter(subTask => !subTask.endDate)
    .map(subTask => filterSubTasks(subTask))
  
  return {
    ...elem,
    subTasks: filteredSubTasks
  }
}

Simply call the function like this:

sampleData.map(elem => filterSubTasks(elem))

var sampleData= [{       
        "rowId": "3.0.0",
        "startDate": "2020-10-20",
        "subTasks": [                 
            {                
                "rowId": "3.3.0",
                "startDate": "2021-05-26",             
                "subTasks": [
                    {
                        "rowId": "3.3.0.1",
                        "startDate": "2021-05-26",                        
                        "subTasks": []
                    },
                    {
                        "rowId": "3.3.0.2",
                        "startDate": "2021-06-09",
                        "endDate": "2021-07-23",  
                        "subTasks": []                      
                    },                   
                ]
            },           
        ]
    }];

function filterSubTasks(elem) {
    const filteredSubTasks = elem.subTasks
    .filter(subTask => !subTask.endDate)
    .map(subTask => filterSubTasks(subTask))
  
  return {
    ...elem,
    subTasks: filteredSubTasks
  }
}

console.log(sampleData.map(elem => filterSubTasks(elem)));

Answer 2

If you want to achieve this, you can utilize a recursive function that loops through only the valid subtasks. Assuming you are familiar with how recursive functions work, here is an example:

function filterSubTasks(elem) {
  const filteredSubTasks = elem.subTasks
    .filter(subTask => !subTask.endDate)
    .map(subTask => filterSubTasks(subTask))
  
  return {
    ...elem,
    subTasks: filteredSubTasks
  }
}

Simply call the function like this:

sampleData.map(elem => filterSubTasks(elem))

var sampleData= [{       
        "rowId": "3.0.0",
        "startDate": "2020-10-20",
        "subTasks": [                 
            {                
                "rowId": "3.3.0",
                "startDate": "2021-05-26",             
                "subTasks": [
                    {
                        "rowId": "3.3.0.1",
                        "startDate": "2021-05-26",                        
                        "subTasks": []
                    },
                    {
                        "rowId": "3.3.0.2",
                        "startDate": "2021-06-09",
                        "endDate": "2021-07-23",  
                        "subTasks": []                      
                    },                   
                ]
            },           
        ]
    }];

function filterSubTasks(elem) {
    const filteredSubTasks = elem.subTasks
    .filter(subTask => !subTask.endDate)
    .map(subTask => filterSubTasks(subTask))
  
  return {
    ...elem,
    subTasks: filteredSubTasks
  }
}

console.log(sampleData.map(elem => filterSubTasks(elem)));

Answer 3

Answer №2

One way to achieve this is through the use of recursion. The values array stores all tasks, which allows for filtration based on any desired property.

var values = [];
function FetchValues(samples){

    if(samples != [] && samples != undefined && samples != null){
        for(var sample of samples){       
            values.push(sample)
            FetchValues(sample.subTasks)
        }
    }else{
        return {};
    }

}
FetchValues(sampleData)

Answer 4

One way to achieve this is through the use of recursion. The values array stores all tasks, which allows for filtration based on any desired property.

var values = [];
function FetchValues(samples){

    if(samples != [] && samples != undefined && samples != null){
        for(var sample of samples){       
            values.push(sample)
            FetchValues(sample.subTasks)
        }
    }else{
        return {};
    }

}
FetchValues(sampleData)

Answer 5

Answer №3

If you would like to apply a filter based on the endDate parameter, one approach is to utilize the forEach method to iterate through the data and store the desired results in an object. This method should help achieve the desired output effectively.

var sampleData= [{       
    "rowId": "3.0.0",
    "startDate": "2020-10-20",
    "subTasks": [                 
        {                
            "rowId": "3.3.0",
            "startDate": "2021-05-26",             
            "subTasks": [
                {
                    "rowId": "3.3.0.1",
                    "startDate": "2021-05-26",                        
                    "subTasks": []
                },
                {
                    "rowId": "3.3.0.2",
                    "startDate": "2021-06-09",
                    "endDate": "2021-07-23",  
                    "subTasks": []                      
                },                   
            ]
        },           
    ]
}]

sampleData.forEach((obj)=> {
   obj.subTasks.forEach((prop) => {
       const newObj = {name: prop};
       console.log(newObj.name.subTasks[1]);
       console.log(newObj.name.subTasks[1].endDate);
   })
})

Answer 6

If you would like to apply a filter based on the endDate parameter, one approach is to utilize the forEach method to iterate through the data and store the desired results in an object. This method should help achieve the desired output effectively.

var sampleData= [{       
    "rowId": "3.0.0",
    "startDate": "2020-10-20",
    "subTasks": [                 
        {                
            "rowId": "3.3.0",
            "startDate": "2021-05-26",             
            "subTasks": [
                {
                    "rowId": "3.3.0.1",
                    "startDate": "2021-05-26",                        
                    "subTasks": []
                },
                {
                    "rowId": "3.3.0.2",
                    "startDate": "2021-06-09",
                    "endDate": "2021-07-23",  
                    "subTasks": []                      
                },                   
            ]
        },           
    ]
}]

sampleData.forEach((obj)=> {
   obj.subTasks.forEach((prop) => {
       const newObj = {name: prop};
       console.log(newObj.name.subTasks[1]);
       console.log(newObj.name.subTasks[1].endDate);
   })
})

Filtering nested objects in JavaScript up to a specific level

Answer №1

Answer №2

Answer №3

Similar questions

Is there a way to extract the year, day, minute, hour, and second from the Date.now() function in Node.js?

Downloading an array as a CSV file using PHP

Updating the Background Image Based on Text Input in JavaScript

How to Retrieve the Id of an Inserted Document in Node.js and MongoDB

"In strict mode, the object is subjected to specific rules

"Exploring the power of AJAX, manipulating strings with JavaScript, and building

Using PHP to submit a form depending on user selection

Tips for stopping the Print dialog box in Mozilla when using the CTRL + P shortcut

Using JQuery's .mouseover and .mouseout methods to modify font colors on a webpage

Using node.js and expressjs, developers can easily incorporate flash messages into

Is there a way to efficiently retrieve distinct values from each item within the axios response object and store them in a vuex state?

Discovering the `findIndex` malfunction in Internet Explorer

What is the proper way to implement JQuery within a constructor function contained in a JavaScript namespace?

Make sure that the click event listener is set up on the anchor element so that it also affects its children

Angular's Components and Directives: A Comprehensive Guide

React application functions correctly on local environment, however encounters an issue during deployment on Heroku

How can I effectively exclude API keys from commits in Express by implementing a .gitignore file?

javascript batch insert new key values

Is there a particular array function that can help me achieve the desired outcome?

When the JavaScript string retrieved from the database is null, it will be displayed as an empty string