如何遍历一个对象？

我想通过一个对象迭代。在浏览器中，JSON视图看起来是这样的：如何遍历一个对象？

{ 
    postalcodes: [{ 
     adminCode2: "708", 
     adminCode3: "70805", 
     adminName3: "Breitenwang", 
     adminCode1: "07", 
     adminName2: "Politischer Bezirk Reutte", 
     lng: 10.7333333, 
     countryCode: "AT", 
     postalcode: "6600", 
     adminName1: "Tirol", 
     placeName: "Breitenwang", 
     lat: 47.4833333 
    }, { 
     adminCode2: "708", 
     adminCode3: "70806", 
     adminName3: "Ehenbichl", 
     adminCode1: "07", 
     adminName2: "Politischer Bezirk Reutte", 
     lng: 10.7, 
     countryCode: "AT", 
     postalcode: "6600", 
     adminName1: "Tirol", 
     placeName: "Ehenbichl", 
     lat: 47.4666667 
    }, ] 
}

直到现在我用的forEach方法：

$(document).ready(function(){ 
    $.getJSON("http://api.geonames.org/postalCodeLookupJSON?postalcode=6600&country=AT&username=demo", function(data) { 
     $.each(data, function(key, val){ 
      items.push("<li id='" + key + "'>" + val + "</li>"); 
     }); 
    });

在开发工具，我看到控制台消息：

["<li id='0'>[object Object]</li>", "<li id='1'>[object Object]</li>",]

其实我想要的将所有关键值作为嵌套列表元素。我怎样才能纠正我的jQuery代码来得到这个？

谢谢

编辑答案：这是我现在变成：

<script> 
$(document).ready(function(){ 
    $.getJSON("http://api.geonames.org/postalCodeLookupJSON?postalcode=6600&country=AT&username=demo", function(data) { 
    var items = []; 
    $.each(data, function (key, value) { 
     $('body').append($('<div></div>').html(key + ' (' + value.length + ' results)')); 
     var list = $('<ul></ul>'); 
     $('body').append(list); 
    }); 
    $.each(data.postalcodes, function(key, val){ 
     for (var k in val) { 
     if (val.hasOwnProperty(k)) { 
      items.push("<li id='" + k + "'>" + val[k] + "</li>"); 
      } 
     } 
     $("<ul/>", { 
     "class": "my-new-list", 
     html: items.join("") 
     }).appendTo("body"); 
    }); 

    }); 
}); 
</script>

来源

2016-07-06 ytsejam

注意，你所拥有的是一个对象，而不是JSON。 –

所以我应该用循环？ – ytsejam

你想从'postalcodes'数组中获得什么值？ –

value是包含postalcodes属性的对象。在此之后，在循环内的val是包含属性的对象。你想这样做：

$.each(value.postalcodes,function(key,val) { 
    //val is now an object with properties adminCode2, adminCode3, etc 
    //e.g. items.push("<li id='"+key+"'>"+val.postalcode+"</li>"); 
});

来源

2016-07-06 13:34:28 Adam

亚当做了这份工作，但我不得不与克里斯夫的答案混合，我很接近，但我不能将它附加到HTML。你能检查我编辑的代码吗？我想把它放在身体里。 – ytsejam

好的解决了我想要的。 – ytsejam

没有测试过，但财产以后也是这样吗？

for (var prop in value) { 
for (var prop2 in value[prop]) { 
    items.push("<li id='" + prop2 + "'>" + value[prop][prop2] + "</li>"); 
} 
}

来源

2016-07-06 13:33:54 krisph

最好不要在外部循环的数组上使用'for..in'循环。见[这个问题]（http://stackoverflow.com/questions/500504/why-is-using-for-in-with-array-iteration-a-bad-idea）。正常的'for'循环是最安全的。 – 4castle

你想要通过postalcodes数组，对吗？因为它是一个数组 - 不是一个对象。

如果是的话，你可以循环容易与map功能

postalcodes.map(function(postal) { 
    // now the "postal" is the object which contains the single props 
});

在你的情况 - 如果你留在这个jQuery的东西 - 使用来自API的响应，采取postalcodes阵列和映射。。返回结果，并将其保存在items VAR ..

$(document).ready(function(){ 
    $.getJSON("http://api...", function(data) { 
     var items = data.postalcodes.map(function(postal, id) { 
      return '<li id="' + id + '">' + postal.adminName2 + '</li>'; 
     }) 
    }); 
});

如果您使用的EcmaScript 6

$(document).ready(() =>{ 
    $.getJSON("http://api...", (data) => { 
     var items = data.postalcodes.map((postal, id) => '<li id="' + id + '">' + postal.adminName2 + '</li>'); 
    }); 
});

希望我可以帮助...

编辑

仅供参考一，在ES6你可以写它的方式更短的:)

$(document).ready(() =>{ 
    $.getJSON("http://api...", ({postalcodes:zips}) => { 
     const items = zips.map(({adminName2:name}, id) => `<li id="${id}">${name}</li>`); 
    }); 
});

来源

2016-07-06 14:00:46

这也是一个有趣的方法，我会研究它。 – ytsejam

的API不目前可用，但我有一些先前保存的数据。

var data = {'postalcodes':[{'adminCode2':'708','adminCode3':'70805','adminName3':'Breitenwang','adminCode1':'07' 
    ,'adminName2':'Politischer Bezirk Reutte','lng':'10.7333333','countryCode':'AT','postalcode':'6600', 
    'adminName1':'Tirol','placeName':'Breitenwang','lat':'47.4833333'},{'adminCode2':'708','adminCode3':'70806', 
    'adminName3':'Ehenbichl','adminCode1':'07','adminName2':'Politischer Bezirk Reutte','lng':'10.7', 
    'countryCode':'AT','postalcode':'6610', 'adminName1':'Tirol', 'placeName':'Ehenbichl','lat': '47.4666667'}]};

首先，您需要遍历邮政编码，然后为每个对象获取邮政编码的值。

var items = []; 
$.each(data.postalcodes, function() { 
    items.push("<li id='postalcode'>" + this.postalcode + "</li>"); 
}); 
console.log(items);

输出是：

["<li id='postalcode'>6600</li>", "<li id='postalcode'>6610</li>"]

来源

2016-07-06 14:11:22 derloopkat

如何遍历一个对象？

回答

相关问题