Copying AJAX JSON object into existing Object

Question

I have several Javascript prototypes. Initially, instances will have only ID's filled in, with some generic place holder information for other data. I then send a message to the server with the ID and the object type (using jQuery's AJAX function) and the server returns a JSON object with all the missing information (but no ID). The variables in the returned object have the exact same name as those in the existing object.

What's the easiest way to transfer this into the existing empty object? I've come up with a few alternatives

set the object equal to the returned object, then copy in the id (loses prototype functions?)
create a function for each object that takes an object with identical structure and copies the data
loop through the key-value pairs of the JSON object to and copy them to existing object

If I use the third option, is this the correct way to do that? :

for (var key in json) {
    if (object.hasOwnProperty(key)) {
        object[key] = json[key];
    }
}

assuming json is the returned object and object is the existing object.

If `json` is plain JSON then I don't think you even need the `hasOwnProperty` check. Unless someone has been funking with `Object.prototype`. — Paul Grime, May 04 '13 at 10:48
The question is, what do you want to do with your JSON-Object. If you want to evaluate to an object, JSON.parse() does the trick for you. If you want to merge it to an existing object, jQuery.extend() would be a better suggestion. — Thomas Junk, May 04 '13 at 11:15
@PaulGrime I'm doing that as a precaution in case there's an extra key in the `json` object that I don't want in the existing `object`. If you'll notice, I'm looping through keys in `json` but checking against `object`. — Jaws212, May 04 '13 at 17:53

score 17 · Answer 1 · answered Jan 08 '20 at 15:58

17

Alternative without jQuery is to use the javascript Object.assign method.

Object.assign(targetObject, json);

answered Jan 08 '20 at 15:58

Karthik Sankar

817
8
11

score 13 · Accepted Answer · answered May 04 '13 at 10:50

13

Try this using extend():

var newObject = jQuery.extend({}, oldObject);

answered May 04 '13 at 10:50

palaѕн

72,112
17
116
136

Sounds perfect! I wasn't aware of this functionality at all. And because it merges all properties, any inheritance I have done will still stick, correct? – Jaws212 May 04 '13 at 17:51

score 1 · Answer 3 · answered May 04 '13 at 10:48

1

You can use jQuery.extend: http://api.jquery.com/jQuery.extend/

$.extend(object1,object2);

If your JSON is a string then create an object from that first:

var object1=$.parseJSON(myJsonString);

answered May 04 '13 at 10:48

HMR

37,593
24
91
160

There is no need for a Methodcall parseJSON(), hence nowadays everybody could use JSON.parse(). jQuery does nothing else: if (window.JSON && window.JSON.parse) { return window.JSON.parse(data); } – Thomas Junk May 04 '13 at 11:12
but if window.JSON.parse is false it'll do a bit more. – HMR May 04 '13 at 12:03
but window.JSON.parse will not fail today – vvondra Jan 11 '16 at 19:03

Copying AJAX JSON object into existing Object

3 Answers3

Linked