Chrome RangeError: Maximum call stack size when using jQuery $ .map

Question

I am testing a web application for my employers, which involves receiving a large amount of data from the server. Data is returned as a JSON object using the $ function . Ajax containing a large number of sub-objects, which I convert to arrays using jQuery $. map as follows

data_points = $.map(result.data.LotsOfIt, function(value, ndx){ return value; }); //Throws Maximum call stack size exceeded with large data set. 

This seems to be an exhaustive limit on the size of the Chromes stack, every time I run this function, Chrome will throw RangeError: The maximum size of the call stack . If I reduce the amount of data returned, it will work fine. Interestingly, FireFox and IE9 will handle a wider range of data, but I thought Chrome had a higher stack size than either of these browsers, so I expected them both to fail. Has anyone else encountered this problem? Is there a workaround? Or will I have to update my code to limit the amount of data returned to avoid this error?

Answer 1

Ok, so after some reading, I suspect that the problem is with a recursive call in the $ .map implementation causing the Chrome browser stack to overflow. I had to rework the code to reprocess the collection of returned JSON objects manually and in a non-recursive manner. After reorganizing the code to use $ .map against the entire collection in the cone, the problem no longer appeared.