从JQuery中没有标题的对象访问JSON对象

时间:2015-06-10 14:55:15

标签: javascript jquery ajax json parsing

我从AJAX调用中收到此JSON文件:

[
    {
        "LINKNAME": "Annual Training",
        "HITS": 1
    },
    {
        "LINKNAME": "In Focus Newsletter",
        "HITS": 1
    },
    {
        "LINKNAME": "NITA (secured)",
        "HITS": 1
    },
    {
        "LINKNAME": "Your Current Events",
        "HITS": 1
    },
] 

这是我的AJAX电话:

$(document).ready(function(e) {
    $.ajax({
        method: "GET",
        url: url,
    }).done(function(api) {
        console.log(api);
        var obj = JSON.parse(api),
            totRes = Object.keys(obj).length;
        $.each(obj.children, function (index, value) {
            alert(value);
        });
    }).fail(function( jqXHR, textStatus ) {
        alert('Service Catalog: Error loading '+jqXHR+' data. Request fail caused by: '+textStatus);
    });
});

我需要能够从JSON中提取数据并使用它,但由于JSON对象不是gioven标题,因此我不确定如何对内部对象内的数据进行极值分析。提前致谢。请问你是否理解我的问题。

3 个答案:

答案 0 :(得分:1)

您的JSON只是一个普通对象数组。

要迭代数组,可以使用各种方法。由于您使用的是jQuery,我只建议$.each

var arr = JSON.parse(api);

$.each(arr, function(i, obj) {
    // access whatever property you want... obj[LINKNAME] or whatever
});

您还可以使用Array.prototype.forEach,甚至只使用基本for循环:

arr.forEach(function(obj) {
    // obj is the current plain object... e.g. { LINKNAME: 'whatever', HITS: 0 }
});

我还会考虑关注你如何指你正在接收的物品。虽然数组是对象,而普通对象是对象,但我可能会坚持将数组称为数组,将普通对象称为对象。这是因为您以JSON的形式接收的是普通对象的数组对象(或更简单地说,是一个对象数组)。

将数组称为“对象”并将其称为obj可能会使您在快速阅读代码时感到困惑(是的,如果最终并不总是接收数组,那么它对于潜在的可扩展性是一个很好的抽象,但事实并非如此。)

此外,一旦您访问each循环中的对象,您可以根据需要迭代对象的属性(taken from this answer):

var obj = {
  "a": 1,
  "b": 2,
  "c": 3
};

for (var prop in obj) {
  if (obj.hasOwnProperty(prop)) { 
  // or if (Object.prototype.hasOwnProperty.call(obj,prop)) for safety...
    alert("prop: " + prop + " value: " + obj[prop])
  }
}

答案 1 :(得分:1)

首先,您可以在发送请求时添加设置dataType: 'json'。这样你就可以将api作为javascript数组。

然后,您将能够通过javascript for进行迭代。

$.ajax({
  method: "GET",
  url: url,
  dataType: "json"
}).done(function(api) {
  for (var i = 0; i < api.length; i++) { 
    var name = api[i]["LINKNAME"],
        hits = api[i]["HITS"];
    // ...
  }
// ...

答案 2 :(得分:1)

$(document).ready(function(e) {
    $.ajax({
        method: "GET",
        url: url,
    }).done(function(api) {
        if (api && api.length > 0) {
            api.forEach(function (item) {
                console.log(item); // logs whole object
                console.log('item name %s', item.LINKNAME);
                console.log('item hits %s', item.HITS);
            });
        }
    }).fail(function( jqXHR, textStatus ) {
        alert('Service Catalog: Error loading '+jqXHR+' data. Request fail caused by: '+textStatus);
    });
});

您可以过滤结果,以确保您只使用同时包含“LINKNAME”和“HITS”的对象:

.done(function(api) {
    if (api && api.length > 0) {
        var objs = api.filter(function (item) {
            return item.hasOwnProperty('LINKNAME') && item.hasOwnProperty('HITS');
        });
        objs.forEach(function (item) {
            console.log(item); // logs whole object
            console.log('item name %s', item.LINKNAME);
            console.log('item hits %s', item.HITS);
        });
    }
});