Question

My final task is to fully recover object previously saved using JSON. For now JSON only allows to recover data, but not behaviour. A possilbe solution is to create a new object (lets call it obj) and copy data from JSON-recovered-object to obj. But it doesn’t look nice for me. What I am asking, is there a way to dynamically change object prototype in JavaScript?

It’s how I solve problem at the moment (using self-made copy method):

(this code on JSFiddle)

function Obj() {
    this.D = "D";
    this.E = "E";
    this.F = "F";

    this.toString = function () {
        return this.D + " * " + this.E + " * " + this.F;
    };

    this.copy = function (anotherObj) {
        for (var property in anotherObj) {
            if (isDef(anotherObj[property]) && isDef(this[property])) {
                this[property] = anotherObj[property];
            }
        }
    }
}
;

$(document).ready(function () {
    var str = $.toJSON(new Obj());
    $("#result").append("<p>JSON: " + str + "</p>");
    var obj = new Obj();
    obj.copy($.parseJSON(str));
    $("#result").append("<p>Recovered obj: " + obj.toString() + "</p>");
});

function isDef(variable)
{
    return typeof variable !== undefined;
}

Answer 1

There are easier methods provided by many popular JS libraries.

For example, if you are using jQuery, you might use the jQuery.extend() method instead of your copy function like so:

var obj = $.extend(new Obj(), $.parseJSON(str));

Forked jsFiddle here.

EDIT: Based on ideas from this question, I was able to get the restored object to have all the nested functionality as well, see the updated jsFiddle.

The core idea is to use prototypes instead of properties, and then make sure the object restored from JSON (which is just data) is the first parameter to $.extend():

function Obj2() {
    this.A = "A";
}
Obj2.prototype.toString = function() {
    return this.A;
};

function Obj() {
    this.A = new Obj2();
    this.D = "D";
    this.E = "E";
    this.F = "F";
}
Obj.prototype.toString = function() {
    return this.A.toString() + " * " + this.D + " * " + this.E + " * " + this.F;
};

var str = $.toJSON(new Obj());
$("#result").append("<p>JSON: " + str + "</p>");
var obj = jQuery.extend($.parseJSON(str), new Obj());
$("#result").append("<p>Recovered obj: " + obj.toString() + "</p>");