json jquery filter javascript array

Question

I have a json object array. I want to search the array and for each object, create a list of 'services' that is a comma-seperated list of all the keys which have a value of "yes". The list of json objects with the services list is then displayed in html using jquery's each.

Its a large json file so I want to do it as efficiently as possible.

I already have the object's properties being accessed through jQuery's each (ie, obj.name) -- so I think it should be possible to filter the services listed for each object using jQuery's filter, and then display the key if the value is yes.

But it seems like a more efficient option would probably be to create a new javascript array, join the services with a value of yes and then add that variable to the html being appended.

Im not sure which would be faster and so far havent been very successful at either... so any advice and examples would be very helpful.

Here's what the json array looks like:

[
 {"name":"name1",
  "service1":"y",
  "service2":"y",
  "service3":"n",
 },

 {"name":"name2",
  "service1":"n",
  "service2":"y",
  "service3":"n",
 },
];

Answer 1

If you just want to filter the array then use grep.

grep - Finds the elements of an array which satisfy a filter function. The original array is not affected.

http://api.jquery.com/jQuery.grep/

Answer 2

First off, delete trailing commas. Internet Explorer gets really, really confused by them. Anyway, I assume you don't want to "search" the array when you say "for each value"; you want to iterate through the array and parse it into a more usable list. The first method I'd suggest is just passing what you want as the array you desire, but if that's not an option, what you're looking for is some variant of this, which should be fairly efficient ( jsFiddle example ):

var json = [
  {"name":"name1", "service1":"y", "service2":"y", "service3":"n"},
  {"name":"name2", "service1":"n", "service2":"y", "service3":"n"}
];
var parsed = {};

for (var i = 0, iLen = json.length; i < iLen; i++) {
  // Assuming all we need are the name and a list
  var name;
  var list = [];

  for (var key in json[i]) {
    var value = json[i][key];

    // We need to hold on to the name or any services with value "y"        
    if (key === "name") {
      name = value;
    } else if (value === "y") {
      list.push(key);
    }
  }

  // Add them to the parsed array however you'd like
  // I'm assuming you want to just list them in plain text
  parsed[name] = list.join(", ");
}

// List them on the web page
for (var key in parsed) {
  document.write(key + ": " + parsed[key] + "<br>");
}

That way you wind up with a display to the visitor of the services available and still keep an array around for further use if necessary.

Answer 3

jQuery.inArray() Search for a specified value within an array and return its index (or -1 if not found).

http://api.jquery.com/jQuery.inArray/

Or

http://api.jquery.com/jQuery.each/