jQuery clone of JSON object returns undefined

Question

According to the docs, jQuery.extend() is a solution to execute both a deep and shallow copy of a JSON object. However, when I use this, I get an undefined object error.

My ajax request function and handler:

var tourData;

$.ajax({
  type: "GET",
  url: "includes/phpscripts.php?action=stops",
  dataType: "json", 
  success: (function(data){
    if (data == 'false')
      console.log("Can't load initial panorama");
    else 
      processOptions(data);

  })
});

function processOptions(data){
  tourData = jQuery.extend(true, {}, data);
  console.log(data.length);
  console.log(tourData.length);

}

In Firebug, data.length returns 6, which is what I expected. However, tourData returns undefined. This occurs with and without true as a parameter for a deep copy

I'm going to need the data from this request avaliable to several functions later on, and those functions will be out of scope. As such, I'd like to have a clone of the response avaliable.

The contents of data are

[
  {"fileName":"..\/panos\/photos\/1-prefix_blended_fused.jpg","name":"Start","lat":"43.682211","lon":"-70.450705","heading":"250","width":"1808","height":"653"},
  {"fileName":"..\/panos\/photos\/2-prefix_blended_fused.jpg","name":"Second","lat":"43.6822","lon":"-70.450769","heading":"250","width":"1600","height":"578"},
  {"fileName":"..\/panos\/photos\/2-prefix_blended_fused.jpg","name":"Second","lat":"43.6822","lon":"-70.450769","heading":"250","width":"1600","height":"578"},
  {"fileName":"..\/panos\/photos\/3-prefix_blended_fused.jpg","name":"Third Stop","lat":"43.682219","lon":"-70.450828","heading":"250","width":"1821","height":"627"},
  {"fileName":"..\/panos\/photos\/4-prefix_blended_fused.jpg","name":"Fourth Stop","lat":"43.68218","lon":"-70.450887","heading":"250","width":"1600","height":"800"},
  {"fileName":"..\/panos\/photos\/5-prefix_blended_fused.jpg","name":"Last Stop","lat":"43.682165","lon":"-70.450933","heading":"250","width":"1808","height":"673"}
]

It seems like data is an array. console.log(data), let's see what's in there. — gen_Eric
– gen_Eric, Commented Jun 15, 2012 at 19:58
Yep, data is an array, not an object. What so you want $.extend to do here? What is the output you desire? — gen_Eric
– gen_Eric, Commented Jun 15, 2012 at 19:59
data is a JSON object. I want to make a copy of it so it is avaliable outside of the ajax request and handler scope. — Jason
– Jason, Commented Jun 15, 2012 at 20:00
tourData = data;? data is an array (of objects), not an object. — gen_Eric
– gen_Eric, Commented Jun 15, 2012 at 20:01

gen_Eric · Accepted Answer · 2012-06-15 19:57:38Z

2

~~You say data.length is 6. This makes me think that data is an array, not an object.~~

data is not an object, it's an array.

$.extend will work with arrays, but the length property will no longer exist, as it converts it to an object.

var data = [{a:12}, {a:13}, {a:14}];
console.log(data.length); // 3
data = $.extend(true, {}, data);
console.log(data); // {0:{a:12}, 1:{a:13}, 2:{a:14}}
console.log(data.length); // undefined

answered Jun 15, 2012 at 19:57

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jason Over a year ago

This was the solution. Thanks!

Collectives™ on Stack Overflow

jQuery clone of JSON object returns undefined

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related