Javascript-在多维数组中查找多个值

Question

Got some JSON that I need to go through to fetch some IDs. The JSON looks like this:

var carousel = [
  {
    "acf": {
      "content": [
        {
          "acf_fc_layout": "custom",
          "content": "Some text"
        },
        {
          "acf_fc_layout": "exhibition",
          "exhibition": 2594
        },
        {
          "acf_fc_layout": "exhibition",
          "exhibition": 1234
        }
      ]
    },
  }
]

For every content where acf_fc_layout == exhibition I must fetch the value (ID) of exhibition so it can be used to fetch further data. As you can see there's multiple exhibition IDs aswell.

My confusion here is that there are both object and array, and that they're nested. I've done some similar stuff with jQuery, but that's out of the question this time. Don't think I need IE8 support, but still find this tricky..

Answer 1

carousel[0].acf.content.forEach(function (item) {
  if (item["acf_fc_layout"] === "exhibition") {
    // do some stuff
    // id for exhibition placed in item["exhibition"] 
  }
});

Answer 2

If your JSON simply looks as you say, this is a simple solution:

var i;
for (i = 0; i < carousel[0].acf.content.length; i++) {
    if (carousel[0].acf.content[i].acf_fc_layout === "exhibition") {
        // do something with carousel[0].acf.content[i].exhibition
    }
}

Alternatively if you have much more content in your JSON, this might be relevant:

var i, j;
for (i = 0; i < carousel.length; i++) {
    if (typeof carousel[i].acf != 'undefined' && typeof carousel[i].acf.content != 'undefined') {
        for (j = 0; j < carousel[i].acf.content.length; j++) {
            if (carousel[i].acf.content[j].acf_fc_layout === "exhibition") {
                // do something with carousel[i].acf.content[j].exhibition
            }
        }
    }
}

Answer 3

http://jsfiddle.net/oucp3v5x/

$(carousel).each(function(i, el){

    $(el.acf.content).each(function(i, el){
        if(el.acf_fc_layout === 'exhibition') {
            $('<div>', {
                text: el.exhibition
            }).appendTo($('#results'));
        }
    });

});

If acf have many content , you need to run additional loop and acf have to be array of objects.

Answer 4

With your current structure, you need to use a foreach and check the value.

 var carousel = [
  {
    "acf": {
      "content": [
        {
          "acf_fc_layout": "custom",
          "content": "Some text"
        },
        {
          "acf_fc_layout": "exhibition",
          "exhibition": 2594
        },
        {
          "acf_fc_layout": "exhibition",
          "exhibition": 1234
        }
      ]
    },
  }
];

$.each(carousel[0].acf.content,function (i,v){
    if(v.acf_fc_layout == "exhibition")
        $(".result").append(v.exhibition+"<br>");
    });

JSFIddle