javascript - 有没有更好的方法来遍历这个对象？

Question

JSON

var data = {
  "countries": {
    "europe" : [{name: "England", abbr: "en"}, {name: "Spain", abbr: "es"}],
    "americas" : [{name: "Unites States"}],
    "asia" : [{name: "China"}]
  }
};

JS

for (k in data) {

  for (x in data[k]) {
    var cObj = data[k][x];

    $("#list").append(
      "<li><p>" + x + "</p></li>"
    );

    for (var i=0; i < cObj.length; i++) {
      $("#list").append(
        "<div> " + cObj[i].name + " </div>"
      );
    }
  }
}

我得到了预期的结果。但我觉得我使用了太多 for 循环。这是我的 jsfiddle示例。

Answer 1

我无法找到一种方法将其减少到一个循环，但您可以将其减少到两个，并提高可读性(正如之前的回答中已经提到的那样)。

$.each(data.countries, function(continent, countries){

  $("#list").append(
      "<li><p>" + continent + "</p></li>"
  );

  $.each(countries, function(index, country){
    $("#list").append(
        "<div> " + country.name + " </div>"
    );
  })

})

Here is an updated jsFiddle .