如何从JavaScript对象中提取数据

时间:2015-12-13 13:34:35

标签: javascript jquery

有一个JavaScript对象,我需要为每个任务元素检索free_timedone_ratiocriticalTaskdependency

这就是我所做的,但它不起作用。

var mock_data_allocation = {"allocation":[{"id":7,"name":"Manoj D","limit":4.0,"available_time":16.0,"tasks":[{"id":34,"name":"issue_25","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":3,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":true,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Manoj D","dependency":[]},{"id":36,"name":"issue_27","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":3,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":true,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Manoj D","dependency":[33,34]},{"id":38,"name":"issue_29","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":5,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":true,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Manoj D","dependency":[35,36]},{"id":39,"name":"issue_30","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":4,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":true,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Manoj D","dependency":[37,38]}]},{"id":5,"name":"Thisun H","limit":4.0,"available_time":16.0,"tasks":[{"id":33,"name":"issue_24","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":5,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":false,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Thisun H","dependency":[]},{"id":35,"name":"issue_26","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":2,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":false,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Thisun H","dependency":[]},{"id":37,"name":"issue_28","projectId":3,"startDate":"2015-12-28","dueDate":"2015-12-31","done_ratio":0,"estimate":6,"remaining":0,"sprintId":"2015-12-28_2015-12-31","criticalTask":false,"assigned":true,"tracker":"Bug","status":"New","assignedTo":"Thisun H","dependency":[34]}]}]};



    $(mock_data_allocation.allocation).each( function(i, value){
        $('.taskdetail').append('<tr>' +
                                '<td>'+ (i+1) +'</td>'+ 
                                '<td>'+ value.tasks.name +'</td>'+ 
                                '<td>'+value.tasks.free_time+'</td>'+
                                '<td>'+value.tasks.done_ratio+'</td>'+
                                '<td>'+value.tasks.criticalTask+'</td>'+
                                '<td>'+value.tasks.dependency.length+'</td>'+
                                
                            '</tr>');
        });
<tbody class="taskdetail"></tbody>

目前的输出是:

1   undefined   undefined   0   true    0
2   undefined   undefined   0   false   0

6 个答案:

答案 0 :(得分:5)

tasks对象的value属性是对象数组,但您的代码假定它是对象。您的代码失败,因为tasks数组没有dependency属性,随后value.tasks.dependency.length失败,因为value.tasks.dependency返回undefinedundefined没有拥有length财产。

您应该从tasks数组中获取特定元素:

.append('<tr>' +
    '<td>'+ (i+1) +'</td>'+ 
    '<td>'+ value.tasks[0].name +'</td>'+ 
    '<td>'+value.tasks[0].free_time+'</td>'+
    '<td>'+value.tasks[0].done_ratio+'</td>'+
    '<td>'+value.tasks[0].criticalTask+'</td>'+
    '<td>'+value.tasks[0].dependency.length+'</td>'+ 
'</tr>');

或迭代它:

var $target = $('.taskdetail');
$.each(mock_data_allocation.allocation, function(i, value) {
    $.each(value.tasks, function(ii, task) {
              $target.append('<tr>' +
                                '<td>'+ (ii+1) +'</td>'+ 
                                '<td>'+ task.name +'</td>'+ 
                                '<td>'+task.free_time+'</td>'+
                                '<td>'+task.done_ratio+'</td>'+
                                '<td>'+task.criticalTask+'</td>'+
                                '<td>'+task.dependency.length+'</td>'+
                            '</tr>');
    });
});

此外,您不应该通过将常规对象传递给jQuery来创建jQuery对象。请改用$.each实用程序功能。

答案 1 :(得分:2)

你应该试试这个......

  $.each(mock_data_allocation.allocation,function(i, value){
    $.each(value.tasks,function(j,val){
        $('.taskdetail').append('<tr>' +
                            '<td>'+ (j+1) +'</td>'+ 
                            '<td>'+ val.name +'</td>'+ 
                            '<td>'+val.free_time+'</td>'+
                            '<td>'+val.done_ratio+'</td>'+
                            '<td>'+val.criticalTask+'</td>'+
                            '<td>'+val.dependency.length+'</td>'+

                        '</tr>');
    });        
});

答案 2 :(得分:0)

$(mock_data_allocation.allocation)没什么,事实上$(mock_data_allocation)什么都没有。

您可能需要jQuery.each( mock_data_allocation.allocation, function ...

答案 3 :(得分:0)

这里的许多答案指出了一个主要问题,即探讨对象的方式,我同意 但我不明白为什么没有答案指出另一个问题:所需的结果来自原始对象中的两个不同级别

task级别的信息为namedone_ratiocriticalTask
但它是一个级别,位于free_time(实际上名为available_time),这对于所有任务都是相同的(下面的代码中注意#2)。 这同样适用于第一个<td>,其中包括一个计数器:这个计数器可以全局计算或在任务级别计算(在下面的代码中注意#1)。

这是一个真正有效的解决方案(see this fiddle):

var all = mock_data_allocation.allocation;
for (var i = 0, n = all.length; i < n; i++) {
  var availTime = all[i].available_time,
      tasks = all[i].tasks;
  for (var j = 0, m = tasks.length; j < m; j++) {
    var task = tasks[j];
    $('.taskdetail').append(
      '<tr>' +
      '<td>' + (i + 1) + '-' + (j + 1) +'</td>'+ // <-- #1
      '<td>' + task.name + '</td>' +
      '<td>' + availTime + '</td>' + // <-- #2
      '<td>' + task.done_ratio + '</td>' +
      '<td>' + task.criticalTask + '</td>' +
      '<td>' + task.dependency.length + '</td>'+
      '</tr>'
    );
  }
}

答案 4 :(得分:-1)

在我看来,你必须解压任务数组

var mock_data_allocation = {
  "allocation": [{
    "id": 7,
    "name": "Manoj D",
    "limit": 4.0,
    "available_time": 16.0,
    "tasks": [{
      "id": 34,
      "name": "issue_25",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 3,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": true,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Manoj D",
      "dependency": []
    }, {
      "id": 36,
      "name": "issue_27",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 3,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": true,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Manoj D",
      "dependency": [33, 34]
    }, {
      "id": 38,
      "name": "issue_29",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 5,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": true,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Manoj D",
      "dependency": [35, 36]
    }, {
      "id": 39,
      "name": "issue_30",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 4,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": true,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Manoj D",
      "dependency": [37, 38]
    }]
  }, {
    "id": 5,
    "name": "Thisun H",
    "limit": 4.0,
    "available_time": 16.0,
    "tasks": [{
      "id": 33,
      "name": "issue_24",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 5,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": false,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Thisun H",
      "dependency": []
    }, {
      "id": 35,
      "name": "issue_26",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 2,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": false,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Thisun H",
      "dependency": []
    }, {
      "id": 37,
      "name": "issue_28",
      "projectId": 3,
      "startDate": "2015-12-28",
      "dueDate": "2015-12-31",
      "done_ratio": 0,
      "estimate": 6,
      "remaining": 0,
      "sprintId": "2015-12-28_2015-12-31",
      "criticalTask": false,
      "assigned": true,
      "tracker": "Bug",
      "status": "New",
      "assignedTo": "Thisun H",
      "dependency": [34]
    }]
  }]
};



$(mock_data_allocation.allocation).each(function(i, value) {
  $(value.tasks).each(function(index, el) {
    $('.taskdetail').append('<tr>' +
      '<td>' + (i + 1) + '</td>' +
      '<td>' + el.name + '</td>' +
      '<td>' + el.free_time + '</td>' +
      '<td>' + el.done_ratio + '</td>' +
      '<td>' + el.criticalTask + '</td>' +
      '<td>' + el.dependency.length + '</td>' +

      '</tr>');
  });

});

https://jsfiddle.net/

答案 5 :(得分:-2)

你的问题在于使用$(mock_data_allocation.allocation).each在JQuery中有两个不同的.each函数

$(selector).each() - 用于迭代jQuery对象

jQuery.each() - 一个通用迭代器函数,可用于无缝迭代对象和数组。

mock_data_allocation不是DOM元素,因此尝试将其作为$(mock_data_allocation.allocation)的JQuery对象失败,因为mock_data_allocation.allocation不是DOM元素。

您需要迭代数据对象,而不是

$(mock_data_allocation.allocation).each( function(i, value){...

你应该做的

$.each(mock_data_allocation.allocation, function(i, value){...

这将解决'未定义'问题。