How to filter an json object by another object - Javascript

Question

How can I filter a json object with another object in Javascript (cannot use JQuery)

This is my JSON object

var jsondata = [
  {
    "firstName": "Sam",
    "lastName": "Jones",
    "age": "10"
  },
  {
    "firstName": "Sam1",
    "lastName": "Jones1",
    "age": "10"
  },
  {
    "firstName": "Sam2",
    "lastName": "Jones2",
    "age": "12"
  },
  {
    "firstName": "Sam3",
    "lastName": "Jones3",
    "age": "13"
  },
  {
    "firstName": "Sam4",
    "lastName": "Jones4",
    "age": "14"
  },
  {
    "firstName": "Sam5",
    "lastName": "Jones5",
    "age": "15"
  },
  {
    "firstName": "Sam",
    "lastName": "Jones11",
    "age": "16"
  },
  {
    "firstName": "Sam6",
    "lastName": "Jones6",
    "age": "17"
  },
  {
    "firstName": "Sam7",
    "lastName": "Jones7",
    "age": "18"
  },
  {
    "firstName": "Sam8",
    "lastName": "Jones8",
    "age": "19"
  },
  {
    "firstName": "Sam9",
    "lastName": "Jones9",
    "age": "20"
  },
  {
    "firstName": "Sam10",
    "lastName": "Jones10",
    "age": "21"
  },
  {
    "firstName": "Sam11",
    "lastName": "Jones11",
    "age": "22"
  },
  {
    "firstName": "Sam12",
    "lastName": "Jones12",
    "age": "23"
  }
]

The above is the filterable object, now below is the object for filtering

var filterArray = [{"id":"firstName","value":["Sam"]},{"id":"lastName","value":["Jones"]}]

I need to check the the fields of json object (jsondata) like firstName, lastName and match the values of both objects.

Suppose firstname field of jsondata will be compared with id of filterArray and their values will be matched. Alongside lastname will also be compared.

FInally I want to store the filtered object (after eliminating those which are not in filter in a variable). How can I realize this functionality? Please help.

I need to implement this using plain JS, I cannot use Jquery.

The posted question does not appear to include any attempt at all to solve the problem. StackOverflow expects you to try to solve your own problem first, as your attempts help us to better understand what you want. Please edit the question to show what you've tried, so as to illustrate a specific roadblock you're running into a minimal reproducible example. For more information, please see How to Ask and take the tour. — CertainPerformance
– CertainPerformance, Commented Jan 2, 2019 at 3:36
I cannot understand how to implement this. That is why I asked the question. — tommy123
– tommy123, Commented Jan 2, 2019 at 3:38

Mark · Accepted Answer · 2019-01-02 03:46:41Z

You can use every and includes to make a boolean value that will work with filter().

For example:

var jsondata = [{"firstName": "Sam","lastName": "Jones","age": "10"},{"firstName": "Sam1","lastName": "Jones1","age": "10"},{"firstName": "Sam2","lastName": "Jones2","age": "12"},{"firstName": "Sam3","lastName": "Jones3","age": "13"},{"firstName": "Sam4","lastName": "Jones4","age": "14"},{"firstName": "Sam5","lastName": "Jones5","age": "15"},{"firstName": "Sam","lastName": "Jones11","age": "16"},{"firstName": "Sam6","lastName": "Jones6","age": "17"},{"firstName": "Sam7","lastName": "Jones7","age": "18"},{"firstName": "Sam8","lastName": "Jones8","age": "19"},{"firstName": "Sam9","lastName": "Jones9","age": "20"},{"firstName": "Sam10","lastName": "Jones10","age": "21"},{"firstName": "Sam11","lastName": "Jones11","age": "22"},{"firstName": "Sam12","lastName": "Jones12","age": "23"}]
  
var filterArray = [{"id":"firstName","value":["Sam"]},{"id":"lastName","value":["Jones"]}]

let filtered = jsondata.filter(item =>        // filter jsondata
       filterArray.every( f =>                // so every member of filter array
            f.value.includes(item[f.id])) )   // has a corresponding item[id] in value

console.log(filtered)

The above filter says that for every item in filterArray you want the value array to include the item keyed to id. This will make it so the item in jsondata needs to match all the criteria in filterArray. If you add Sam1 and Jones1 to the arrays, you'll get two items in the filter.

var jsondata = [{"firstName": "Sam","lastName": "Jones","age": "10"},{"firstName": "Sam1","lastName": "Jones1","age": "10"},{"firstName": "Sam2","lastName": "Jones2","age": "12"},{"firstName": "Sam3","lastName": "Jones3","age": "13"},{"firstName": "Sam4","lastName": "Jones4","age": "14"},{"firstName": "Sam5","lastName": "Jones5","age": "15"},{"firstName": "Sam","lastName": "Jones11","age": "16"},{"firstName": "Sam6","lastName": "Jones6","age": "17"},{"firstName": "Sam7","lastName": "Jones7","age": "18"},{"firstName": "Sam8","lastName": "Jones8","age": "19"},{"firstName": "Sam9","lastName": "Jones9","age": "20"},{"firstName": "Sam10","lastName": "Jones10","age": "21"},{"firstName": "Sam11","lastName": "Jones11","age": "22"},{"firstName": "Sam12","lastName": "Jones12","age": "23"}]
  
var filterArray = [{"id":"firstName","value":["Sam", "Sam1"]},{"id":"lastName","value":["Jones", "Jones1"]}]

let filtered = jsondata.filter(item =>        // filter jsondata
       filterArray.every( f =>                // so every member of filter array
            f.value.includes(item[f.id])) )   // has a corresponding item[id] in value

console.log(filtered)

Henry Howeson · Accepted Answer · 2019-01-02 03:57:14Z

0

If any of the conditions in the filterArray are false then it will return false, otherwise it will return true. Array.prototype.filter() will create a new array with items for which the function returned true.

const jsondata = jsondata=[{firstName:"Sam",lastName:"Jones",age:"10"},{firstName:"Sam1",lastName:"Jones1",age:"10"},{firstName:"Sam2",lastName:"Jones2",age:"12"},{firstName:"Sam3",lastName:"Jones3",age:"13"},{firstName:"Sam4",lastName:"Jones4",age:"14"},{firstName:"Sam5",lastName:"Jones5",age:"15"},{firstName:"Sam",lastName:"Jones11",age:"16"},{firstName:"Sam6",lastName:"Jones6",age:"17"},{firstName:"Sam7",lastName:"Jones7",age:"18"},{firstName:"Sam8",lastName:"Jones8",age:"19"},{firstName:"Sam9",lastName:"Jones9",age:"20"},{firstName:"Sam10",lastName:"Jones10",age:"21"},{firstName:"Sam11",lastName:"Jones11",age:"22"},{firstName:"Sam12",lastName:"Jones12",age:"23"}];

const filterArray = [{"id":"firstName","value":["Sam"]},{"id":"lastName","value":["Jones"]}];

var match = jsondata.filter(function(element){

    for(let i=0; i<filterArray.length; i++){
        if(!filterArray[i].value.includes(element[filterArray[i].id])){
            return false
        }
    }

    return true;

});

console.log(match);

edited Jan 2, 2019 at 3:57

answered Jan 2, 2019 at 3:44

Henry Howeson

7858 silver badges21 bronze badges

2 Comments

Mark Over a year ago

Why is this returning Sam1 Jones1 when the Sam Jones is in the array?

Henry Howeson Over a year ago

@MarkMeyer fixed

Collectives™ on Stack Overflow

How to filter an json object by another object - Javascript

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related