Meek Meek -4 years ago 141
jQuery Question

Parse resume.json in multiple levels

I'm trying to parse a json file, but I don't know how to loop root nodes that are arrays.

The resume.json - a JSON-based standard for resumes - is here:

{
"basics": {
"name": "John Doe",
"label": "Programmer",
"picture": "",
"email": "john@gmail.com",
"phone": "(912) 555-4321",
"website": "http://johndoe.com",
"summary": "A summary of John Doe...",
"location": {
"address": "2712 Broadway St",
"postalCode": "CA 94115",
"city": "San Francisco",
"countryCode": "US",
"region": "California"
},
"profiles": [{
"network": "Twitter",
"username": "john",
"url": "http://twitter.com/john"
}]
},
"work": [{
"company": "Company",
"position": "President",
"website": "http://company.com",
"startDate": "2013-01-01",
"endDate": "2014-01-01",
"summary": "Description...",
"highlights": [
"Started the company"
]
},
{
"company": "Company",
"position": "President",
"website": "http://company.com",
"startDate": "2013-01-01",
"endDate": "2014-01-01",
"summary": "Description...",
"highlights": []
}
],
"volunteer": [{
"organization": "Organization",
"position": "Volunteer",
"website": "http://organization.com/",
"startDate": "2012-01-01",
"endDate": "2013-01-01",
"summary": "Description...",
"highlights": [
"Awarded 'Volunteer of the Month'"
]
}],
"education": [{
"institution": "University",
"area": "Software Development",
"studyType": "Bachelor",
"startDate": "2011-01-01",
"endDate": "2013-01-01",
"gpa": "4.0",
"courses": [
"DB1101 - Basic SQL"
]
},
{
"institution": "University",
"area": "Software Development 2",
"studyType": "Master",
"startDate": "2014-01-01",
"endDate": "2016-01-01",
"gpa": "6.0",
"courses": []
}
],
"awards": [{
"title": "Award",
"date": "2014-11-01",
"awarder": "Company",
"summary": "There is no spoon."
}],
"publications": [{
"name": "Publication",
"publisher": "Company",
"releaseDate": "2014-10-01",
"website": "http://publication.com",
"summary": "Description..."
}],
"skills": [{
"name": "Web Development",
"level": "Master",
"keywords": [
"HTML",
"CSS",
"Javascript"
]
}],
"languages": [{
"name": "English",
"level": "Native speaker"
}],
"interests": [{
"name": "Wildlife",
"keywords": [
"Ferrets",
"Unicorns"
]
},
{
"name": "Front-end Development",
"level": "",
"keywords": []
}
],
"references": [{
"name": "Jane Doe",
"reference": "Reference..."
}]
}


This is what I have so far:

$.getJSON('resume.json', function(data) {
console.log(data);
$.each(data, function(i, item) {
var name = this.name;
var label = this.label;
console.log(name); // works
console.log(label); // works
});
});


But how can I retrieve the companies under the node "work"? Or the different institutions under "education"? How can I handle those arrays?

Thanks in advance.

Answer Source

The data is stored in plain old Javascript arrays, as such you can just loop through them as needed. For example:

$.getJSON('resume.json', function(data) {
    // how can I retrieve the companies under the node "work"? 
    data.work.forEach(function(w) {
        console.log(w.company);
    })

    // Or the different institutions under "education"?
    data.education.forEach(function(e) {
        console.log(e.institution);
    })
});

var data = {
  "basics": {
    "name": "John Doe",
    "label": "Programmer",
    "picture": "",
    "email": "john@gmail.com",
    "phone": "(912) 555-4321",
    "website": "http://johndoe.com",
    "summary": "A summary of John Doe...",
    "location": {
      "address": "2712 Broadway St",
      "postalCode": "CA 94115",
      "city": "San Francisco",
      "countryCode": "US",
      "region": "California"
    },
    "profiles": [{
      "network": "Twitter",
      "username": "john",
      "url": "http://twitter.com/john"
    }]
  },
  "work": [{
    "company": "Company 1",
    "position": "President",
    "website": "http://company.com",
    "startDate": "2013-01-01",
    "endDate": "2014-01-01",
    "summary": "Description...",
    "highlights": [
      "Started the company"
    ]
  }, {
    "company": "Company 2",
    "position": "President",
    "website": "http://company.com",
    "startDate": "2013-01-01",
    "endDate": "2014-01-01",
    "summary": "Description...",
    "highlights": []
  }],
  "volunteer": [{
    "organization": "Organization",
    "position": "Volunteer",
    "website": "http://organization.com/",
    "startDate": "2012-01-01",
    "endDate": "2013-01-01",
    "summary": "Description...",
    "highlights": [
      "Awarded 'Volunteer of the Month'"
    ]
  }],
  "education": [{
    "institution": "University 1",
    "area": "Software Development",
    "studyType": "Bachelor",
    "startDate": "2011-01-01",
    "endDate": "2013-01-01",
    "gpa": "4.0",
    "courses": [
      "DB1101 - Basic SQL"
    ]
  }, {
    "institution": "University 2",
    "area": "Software Development 2",
    "studyType": "Master",
    "startDate": "2014-01-01",
    "endDate": "2016-01-01",
    "gpa": "6.0",
    "courses": []
  }],
  "awards": [{
    "title": "Award",
    "date": "2014-11-01",
    "awarder": "Company",
    "summary": "There is no spoon."
  }],
  "publications": [{
    "name": "Publication",
    "publisher": "Company",
    "releaseDate": "2014-10-01",
    "website": "http://publication.com",
    "summary": "Description..."
  }],
  "skills": [{
    "name": "Web Development",
    "level": "Master",
    "keywords": [
      "HTML",
      "CSS",
      "Javascript"
    ]
  }],
  "languages": [{
    "name": "English",
    "level": "Native speaker"
  }],
  "interests": [{
    "name": "Wildlife",
    "keywords": [
      "Ferrets",
      "Unicorns"
    ]
  }, {
    "name": "Front-end Development",
    "level": "",
    "keywords": []
  }],
  "references": [{
    "name": "Jane Doe",
    "reference": "Reference..."
  }]
}

// how can I retrieve the companies under the node "work"? 
data.work.forEach(function(w) {
  console.log(w.company);
})

// Or the different institutions under "education"?
data.education.forEach(function(e) {
  console.log(e.institution);
})

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download