I have a large JSON file with a snippet of the file below. Please ignore the values as they are only used as placeholders for this question.

"restaurants":[
            "name": "Burger King",
            "location": "Seattle, WA",
            "latitude":  0.000,
            "longitude": 0.0000,
            "server": "BKSEATAC1",
            "serverAddress": "127.0.0.1",
            "taskNames": ["BurgerOne","BurgerTwo","BurgerThree"],
            "currentTasks": ["BurgerOne"],
            "tasks": [                       {"name":"BurgerOne","owner":"Tom","startTime":"11:00","endTime":"11:05","duration":"5"},

Using jQuery, I am able to iterate through the "restaurants" and set values for variables in the following manner:

$.getJSON('json/DATA.json', function(data) {
  $.each(data.restaurants, function(key, val) {
    var restaurantName = this.name;
    var restaurantLocation = this.location;

(Please note that the code above is just a snippet)

To iterate through the "inner" JSON starting at "tasks", I use the following code

$.getJSON('json/DATA.json', function(data) {
  $.each(data.restaurants, function(key, val) {
    $.each(val.tasks, function(i, j){
    var taskName = this.name;
    var taskOwner = this.owner;

(Another snippet)

The problem I am having is that if I bine the code, variables are assigned correctly in the first iteration but not the second. The loop iterates through "restaurants" and then executes the rest of the code in the script and only then iterates through the "tasks". I need all the variables set on the first pass. Any tips or suggestions would be appreciated.

Thanks in advance!

I have a large JSON file with a snippet of the file below. Please ignore the values as they are only used as placeholders for this question.

"restaurants":[
            "name": "Burger King",
            "location": "Seattle, WA",
            "latitude":  0.000,
            "longitude": 0.0000,
            "server": "BKSEATAC1",
            "serverAddress": "127.0.0.1",
            "taskNames": ["BurgerOne","BurgerTwo","BurgerThree"],
            "currentTasks": ["BurgerOne"],
            "tasks": [                       {"name":"BurgerOne","owner":"Tom","startTime":"11:00","endTime":"11:05","duration":"5"},

Using jQuery, I am able to iterate through the "restaurants" and set values for variables in the following manner:

$.getJSON('json/DATA.json', function(data) {
  $.each(data.restaurants, function(key, val) {
    var restaurantName = this.name;
    var restaurantLocation = this.location;

(Please note that the code above is just a snippet)

To iterate through the "inner" JSON starting at "tasks", I use the following code

$.getJSON('json/DATA.json', function(data) {
  $.each(data.restaurants, function(key, val) {
    $.each(val.tasks, function(i, j){
    var taskName = this.name;
    var taskOwner = this.owner;

(Another snippet)

The problem I am having is that if I bine the code, variables are assigned correctly in the first iteration but not the second. The loop iterates through "restaurants" and then executes the rest of the code in the script and only then iterates through the "tasks". I need all the variables set on the first pass. Any tips or suggestions would be appreciated.

Thanks in advance!

• javascript
• jquery
• json

Share Improve this question Follow asked May 27, 2014 at 21:49 GIS StudentGIS Student 9911 gold badge22 silver badges1010 bronze badges 4

• Travis J already answered your question, but I'd like to point out that using jQuery to loop arrays/objects can often be slower perf than using plain JavaScript - and with plain JS you wouldn't have these nested closures to trip over... That's not me saying "you shouldn't be doing it this way", but pointing out an alternative. – encoder Commented May 27, 2014 at 22:13
• Can you elaborate with an example? That would be most helpful for myself and others. Thank you! – GIS Student Commented May 28, 2014 at 16:59
• 1 Here's a jsperf test that shows I'm mostly wrong :) jsperf./json-iteration-jquery-vs-native Note: "Other" is IE11 on Desktop – encoder Commented May 28, 2014 at 22:25
• Performance aside, though, I have to believe that reusing variables (as the while loop code does) has to be better over time for garbage collection than the closures jQuery creates. I guess it depends on how often you're performing this action... – encoder Commented May 28, 2014 at 22:30

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

If you want the outer scope inside the inner one, then you will need to store the reference in a variable. I usually use me as the name, but it is just a name

$.getJSON('json/DATA.json', function(data) {
 $.each(data.restaurants, function(key, val) {
  var me = this;//save `this` reference
  $.each(val.tasks, function(i, j){
   var restaurantName = me.name;//use `this` from outer scope
   var restaurantLocation = me.location;//use `this` from outer scope
   var taskName = this.name;
   var taskOwner = this.owner;