如何使用Javascript或JQuery搜索巨大的JSON

Question

In my application, web service returns a large dataset of JSON file. This is the part of my JSON string.

[
       {
          "Value":"21",
          "Province":"Default",
          "Branches":[
             {
                "Value":"1108",
                "Province":"Davie",
                "IsValid":"False"
             },
             {
                "Value":"1107",
                "Province":"Ab area109",
                "IsValid":"False"
             },
             {
                "Value":"1105",
                "Province":"Hollywood",
                "IsValid":"False"
             }
          ]
       },
       {
          "Value":"17",
          "Province":"East",
          "Branches":[
             {
                "Value":"212",
                "Province":"area109",
                "IsValid":"False"
             },
             {
                "Value":"219",
                "Province":"area116",
                "IsValid":"False"
             }
          ]
       },
       {
          "Value":"24",
          "Province":"East11",
          "Branches":[
             {
                "Value":"211",
                "Province":"area108",
                "IsValid":"False"
             },
             {
                "Value":"218",
                "Province":"area109",
                "IsValid":"False"
             },
             {
                "Value":"1102",
                "Province":"area999",
                "IsValid":"False"
             }
          ]
       },
       {
          "Value":"25",
          "Province":"hilton25",
          "Branches":[
             {
                "Value":"213",
                "Province":"area110",
                "IsValid":"False"
             },
             {
                "Value":"220",
                "Province":"area999",
                "IsValid":"False"
             }
          ]
       }
]

I need to search province name and get all the nodes that match up until its parent. Which means I need to search provine name by Root level and Branche level.

as the eg 1. when the search key = Default , Following JSON sholud be return.

[
       {
          "Value":"21",
          "Province":"Default",
          "Branches":[
             {
                "Value":"1108",
                "Province":"Davie",
                "IsValid":"False"
             },
             {
                "Value":"1107",
                "Province":"Ab area109",
                "IsValid":"False"
             },
             {
                "Value":"1105",
                "Province":"Hollywood",
                "IsValid":"False"
             }
          ]
       }
]

eg 2. when the search key = area110 , Following JSON sholud be return.

[
    {
      "Value":"25",
      "Province":"hilton25",
      "Branches":[
         {
            "Value":"213",
            "Province":"area110",
            "IsValid":"False"
         }
      ]
    }
]

How can I do this by using Javascript or JQuery. Please help me.

Answer 1

In JavaScript, you can call JSON.parse() to parse that input into an array of JavaScript Objects. From there, it's pretty simple with a couple for-of loops.

function searchProvince(prov) {
  var result = [];
  var json; // JSON string (or you can pass it in as a function parameter)
  /*
   * if you don't already have the JSON string, get it here
   */
  var objects = JSON.parse(json); // parse JSON string as JavaScript Object array
  for (obj of objects) {
    // if the base Province matches, take the whole object
    if (obj.Province === prov) {
      result.push(obj);
    } else {
      // otherwise, only take the branches that have a matching Province
      var toAdd = {Value: obj.Value, Province: obj.Province, Branches: []};
      for (branch of obj.Branches) {
        if (branch.Province === prov) {
          toAdd.Branches.push(branch);
        }
      }
      // only add the copy if any branches were matched
      if (toAdd.Branches.length) {
        result.add(toAdd);
      }
    }
  }
  return JSON.stringify(result); // returns the result as a JSON string
  // can also return result if you want the array of JavaScript Objects
}

It's been a while since I've developed in JS, so if this could be cleaner, let me know!

Answer 2

One possible solution is to use Array.filter() to keep only the objects that satisfies one of the next conditions:

• A) The Province property of the object match the related searched key .
• B) Some object inside the Branches array has a match on the searched key .

If the condition B) is satisfied, we also use filter() to keep only the matching objects inside Branches array.

 let input=[{"Value":"21","Province":"Default","Branches":[{"Value":"1108","Province":"Davie","IsValid":"False"},{"Value":"1107","Province":"Ab area109","IsValid":"False"},{"Value":"1105","Province":"Hollywood","IsValid":"False"}]},{"Value":"17","Province":"East","Branches":[{"Value":"212","Province":"area109","IsValid":"False"},{"Value":"219","Province":"area116","IsValid":"False"}]},{"Value":"24","Province":"East11","Branches":[{"Value":"211","Province":"area108","IsValid":"False"},{"Value":"218","Province":"area109","IsValid":"False"},{"Value":"1102","Province":"area999","IsValid":"False"}]},{"Value":"25","Province":"N25","Branches":[{"Value":"213","Province":"area110","IsValid":"False"},{"Value":"220","Province":"area999","IsValid":"False"}]}] const filterByProvinceKey = (arr, key) => { return arr.filter(parent => { let someChildMatch = parent.Branches.some( child => child.Province === key ); if (parent.Province === key) { return true; } else if (someChildMatch) { parent.Branches = parent.Branches.filter(c => c.Province === key); return true; } return false; }); } console.log("Key = 'Default':", filterByProvinceKey(input, "Default")); console.log("Key = 'area110':", filterByProvinceKey(input, "area110")); 

 .as-console {background-color:black !important; color:lime;} .as-console-wrapper {max-height:100% !important; top:0;} 

In the case your input is a JSON (string), then you will need to use JSON.parse() first

let input = JSON.parse(<some_json>);

If, instead, you don't need a strict match on the key and you wanted to keep register where a section of the Province name matched the search key , then you can use String.match() for this:

 let input=[{"Value":"21","Province":"Default","Branches":[{"Value":"1108","Province":"Davie","IsValid":"False"},{"Value":"1107","Province":"Ab area109","IsValid":"False"},{"Value":"1105","Province":"Hollywood","IsValid":"False"}]},{"Value":"17","Province":"East","Branches":[{"Value":"212","Province":"area109","IsValid":"False"},{"Value":"219","Province":"area116","IsValid":"False"}]},{"Value":"24","Province":"East11","Branches":[{"Value":"211","Province":"area108","IsValid":"False"},{"Value":"218","Province":"area109","IsValid":"False"},{"Value":"1102","Province":"area999","IsValid":"False"}]},{"Value":"25","Province":"N25","Branches":[{"Value":"213","Province":"area110","IsValid":"False"},{"Value":"220","Province":"area999","IsValid":"False"}]}] const filterByProvinceKey = (arr, key) => { let reKey = new RegExp(key, "i"); return arr.filter(parent => { let someChildMatch = parent.Branches.some( child => child.Province.match(reKey) ); if (parent.Province.match(reKey)) { return true; } else if (someChildMatch) { parent.Branches = parent.Branches.filter(c => c.Province.match(reKey)); return true; } return false; }); } console.log("Key = 'AreA':", filterByProvinceKey(input, "area")); 

 .as-console {background-color:black !important; color:lime;} .as-console-wrapper {max-height:100% !important; top:0;} 

Answer 3

Try this,hope it helps.

 let inp = [ { "Value":"21", "Province":"Default", "Branches":[ { "Value":"1108", "Province":"Davie", "IsValid":"False" }, { "Value":"1107", "Province":"Ab area109", "IsValid":"False" }, { "Value":"1105", "Province":"Hollywood", "IsValid":"False" } ] }, { "Value":"17", "Province":"East", "Branches":[ { "Value":"212", "Province":"area109", "IsValid":"False" }, { "Value":"219", "Province":"area116", "IsValid":"False" } ] }, { "Value":"24", "Province":"East11", "Branches":[ { "Value":"211", "Province":"area108", "IsValid":"False" }, { "Value":"218", "Province":"area109", "IsValid":"False" }, { "Value":"1102", "Province":"area999", "IsValid":"False" } ] }, { "Value":"25", "Province":"hilton25", "Branches":[ { "Value":"213", "Province":"area110", "IsValid":"False" }, { "Value":"220", "Province":"area999", "IsValid":"False" } ] } ]; var key = prompt("Please enter the key"); // Your search key var result =[] for(d in inp){ if(inp[d]['Province']==key) result.push(inp[d]) for(d1 in inp[d]['Branches']) if(inp[d]['Branches'][d1]['Province']==key) result.push(inp[d]) } console.log(result)