使用Jquery重新格式化json数据

时间:2015-07-23 22:19:43

标签: javascript jquery json

我需要转换以下JSON数据:

var response = {
   "data":    {
      "List":       [
                  {
            "Name": "Mary",
            "state": "AZ",
            "Matriculation": "complete",
            "Graduation": "complete",
            "Masters": "complete",
            "Phd": "notStarted"
         },
                  {
            "Name": "Stephanie",
            "state": "CT",
            "Matriculation": "complete",
            "Graduation": "complete",
            "Masters": "complete",
            "Phd": "notStarted"
         },
         {
            "Name": "John",
            "state": "CT",
            "Matriculation": "complete",
            "Graduation": "planning",
            "Masters": "notStarted",
            "Phd": "notStarted"
         }]
   }
}

使用jQuery进入以下内容:

[ 
   {  
   "state":"AZ",
      "Matriculation":[  
         {  
            "Name":"Mary",
            "status":"complete"
         }
      ],
      "Graduation":[  
         {  
            "Name":"Mary",
            "status":"complete"
         }
      ], 
      "Masters":[  
         {  
            "Name":"Mary",
            "status":"complete"
         }
      ],
      "Phd":[  
         {  
            "Name":"Mary",
            "status":"notStarted"
        }
      ] 
   }, 
   {  
      "state":"CT",
      "Matriculation":[  
         {  
            "Name":"Stephanie",
            "status":"complete"
         },
         {  
            "Name":"John",
            "status":"complete"
         }
      ],
      "Graduation":[  
         {  
            "Name":"Stephanie",
            "status":"complete"
         },
         {  
            "Name":"John",
            "status":"planning"
         }
      ], 
      "Masters":[  
         {  
            "Name":"Stephanie",
            "status":"complete"
         },
         {  
            "Name":"John",
            "status":"notStarted"
         }
      ],
      "Phd":[  
         {  
            "Name":"Stephanie",
            "status":"notStarted"
         },
         {  
            "Name":"John",
            "status":"notStarted"
         }
      ]                 
   }
]

这是我迄今为止尝试过的,没有任何进展。 我试图首先为一个州完成这个。

这是小提琴: http://jsfiddle.net/sqgdyk6f/

感谢任何指导。 我是JSON操作的新手。

提前致谢!

1 个答案:

答案 0 :(得分:3)

您应该做的第一件事是分析您的源格式和目标格式。

  • 您的来源格式只是个人对象的数组。

  • 您的目标格式是按州分组人员的对象 并进入某些类别。

接下来,考虑一下如何将源码放入此目的地。

您将要遍历源中的每个人,并尝试将其添加到您的状态数组中。现在,我会说你的目标格式有点奇怪,但通过编写几个辅助函数,你可以实现这种格式。

再次查看目标格式。这是一个对象数组。该数组中每个对象的一部分是一个名为state的属性,它具有对象所代表的状态的值。您将需要一个可以通过此数组查找特定状态的函数,并为您返回现有对象。如果状态不存在,它应该为您添加一个新的数组并返回该数组。

由于JSON只是意味着JavaScript Object Notation,并且您实际上正在使用JavaScript对象,因此您应该创建一个对目标数组的每个条目进行建模的对象。我打电话给这些StateSummary。

function StateSummary(state) {
    this.state = state;
    this.Matriculation = [];
    this.Graduation = [];
    this.Masters = [];
    this.Phd = [];
}

您能看到此对象如何表示目标数组中的每个条目吗?

现在您有一个对每个条目建模的对象,我们需要一个能够检查某个状态的条目是否已存在的函数。如果存在,它将返回该对象。如果它不存在,它将向数组添加一个新对象,并返回这个新对象。

function addOrGetState(array, state) {
    for (var i = 0; i < array.length; i++) {
        var obj = array[i];

        if (obj.state === state)
            return obj;
    }

    //If the function got here, then it didn't find a matching state.
    var obj = new StateSummary(state);
    array.push(obj); //Add the new object to the array.
    return obj; //Return the new object.
}

因此,现在您可以从目标数组中获取状态条目,并且可以创建新条目。

继续创建一个将人员添加到StateSummary对象的函数。

function addPersonToStateSummary(person, stateSummary) {
    stateSummary.Matriculation.push({ Name: person.Name, status: person.Matriculation });
    stateSummary.Graduation.push({ Name: person.Name, status: person.Graduation});
    stateSummary.Masters.push({ Name: person.Name, status: person.Masters});
    stateSummary.Phd.push({ Name: person.Name, status: person.Phd});
}

最后一部分是迭代源数组,并将数据按摩到目标数组中。

var sourceArray = response.data.List; //You provided this.
var destinationArray = []; //Allocate a new array to put stuff in.

for (var i = 0; i < sourceArray.length; i++) {
    var person = sourceArray[i]; //Each entry of the source array represents a person.

    var stateSummary = addOrGetState(destinationArray, person.state);

    addPersonToStateSummary(person, stateSummary);
}

这应该可以满足您的需求。 我希望这个细分会教你如何以分析的方式思考问题,首先打破它的步骤,然后用代码解决它们。

这是一个演示:

var response = {
  "data": {
    "List": [{
      "Name": "Mary",
      "state": "AZ",
      "Matriculation": "complete",
      "Graduation": "complete",
      "Masters": "complete",
      "Phd": "notStarted"
    }, {
      "Name": "Stephanie",
      "state": "CT",
      "Matriculation": "complete",
      "Graduation": "complete",
      "Masters": "complete",
      "Phd": "notStarted"
    }, {
      "Name": "John",
      "state": "CT",
      "Matriculation": "complete",
      "Graduation": "planning",
      "Masters": "notStarted",
      "Phd": "notStarted"
    }]
  }
};

function StateSummary(state) {
  this.state = state;
  this.Matriculation = [];
  this.Graduation = [];
  this.Masters = [];
  this.Phd = [];
}

function addOrGetState(array, state) {
  for (var i = 0; i < array.length; i++) {
    var obj = array[i];

    if (obj.state === state)
      return obj;
  }

  //If the function got here, then it didn't find a matching state.
  var obj = new StateSummary(state);
  array.push(obj); //Add the new object to the array.
  return obj; //Return the new object.
}


function addPersonToStateSummary(person, stateSummary) {
  stateSummary.Matriculation.push({
    Name: person.Name,
    status: person.Matriculation
  });
  stateSummary.Graduation.push({
    Name: person.Name,
    status: person.Graduation
  });
  stateSummary.Masters.push({
    Name: person.Name,
    status: person.Masters
  });
  stateSummary.Phd.push({
    Name: person.Name,
    status: person.Phd
  });
}


var sourceArray = response.data.List; //You provided this.
var destinationArray = []; //Allocate a new array to put stuff in.

for (var i = 0; i < sourceArray.length; i++) {
  var person = sourceArray[i]; //Each entry of the source array represents a person.

  var stateSummary = addOrGetState(destinationArray, person.state);

  addPersonToStateSummary(person, stateSummary);
}

document.getElementById('result').innerHTML = JSON.stringify(destinationArray);
<div id="result"></div>