解析 json 数组并遍历 Pivot.js 的所有数据

Question

I have a json array data in this format:

{
  "jobs": [
    {
      "id": "some_random_id_1",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 40,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_2",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 30,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_3",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    },
    {
      "id": "some_random_id_4",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    }
  ],
  "job_id": "some_id",
  "total_jobs": 60
}

where I just need to access the jobs object and grab id and status and all info for job_fields and stats (or all info for now).

  // example is from here
  // https://pivottable.js.org/examples/mps.html
  $(function(){
    $.getJSON("data.json", function(mps) {
        $("#output").pivotUI(mps);
    });
 });

the example works with this json format:

[{
    "Province": "Quebec",
    "Party": "NDP",
    "Age": 22,
    "Name": "Liu, Laurin",
    "Gender": "Female"
  },
  {
    "Province": "Quebec",
    "Party": "Bloc Quebecois",
    "Age": 43,
    "Name": "Mourani, Maria",
    "Gender": "Female"
  },
  {
    "Province": "Ontario",
    "Party": "Conservative",
    "Age": "",
    "Name": "O'Toole, Erin",
    "Gender": "Male"
  }
]

I am not sure how to modify the javascript so it can read my json format. I can't modify the json format to match the above format, so in the above javascript example, province, party, etc are all passed to the function.

I want to do the same but with my json format, so output id, status, all members of job_fields (ex: TITLE, etc. ), all members of stats (ex: applied, rejected .

Answer 1

Assuming all jobs have job_fields.TITLE, stats.applied and stats.rejected maybe the following will do:

 const json = { "jobs": [ { "id": "some_random_id_1", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 40, "rejected": 20 } }, { "id": "some_random_id_2", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 30, "rejected": 20 } }, { "id": "some_random_id_3", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 13, "rejected": 1 } }, { "id": "some_random_id_4", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 13, "rejected": 1 } } ], "job_id": "some_id", "total_jobs": 60 }; console.log( json.jobs.map( (job)=>({ id:job.id, status:job.status, title:job.job_fields.TITLE, applied:job.stats.applied, rejected:job.stats.rejected }) ) );

Answer 2

Can try with below snippet:

$(function(){
$.getJSON("data.json", function(orgData) {
    var pivotData = [];
    orgData.jobs.forEach(function (job, ind) {
        var reqInfo = {};
        reqInfo['id'] = job.id;
        reqInfo['status'] = job.status;
        reqInfo['jobTitle'] = job.job_fields && job.job_fields.TITLE;
        reqInfo['applied'] = job.stats && job.stats.applied;
        reqInfo['rejected'] = job.stats && job.stats.rejected;
        pivotData.push(reqInfo)
    })
    $("#output").pivotUI(pivotData);
});

});

Answer 3

You can use map and use Object.assign and spread operator to make an object

 var obj={"jobs":[{"id":"some_random_id_1","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":40,"rejected":20}},{"id":"some_random_id_2","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":30,"rejected":20}},{"id":"some_random_id_3","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}},{"id":"some_random_id_4","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}}],"job_id":"some_id","total_jobs":60} var result = obj.jobs.map(({id,status,job_fields,stats}) => { return Object.assign({}, {id}, {status}, {...job_fields}, {...stats}); }); console.log(result);

Or you can make it shorter like:

var result = obj.jobs.map( ({id,status,job_fields,stats}) => Object.assign({},{id},{status},{...job_fields},{...stats}) );

Answer 4

$("#output").pivotUI(mps.jobs);