Question

I have a Backbone application where the JSON I get from the server isn’t exactly 1 on 1 with how I want my models to look. I use custom parse functions for my models, ex:

parse: function(response) {
   var content = {};
   content.id = response.mediaId;
   content.image = response.image.url;
   return content;
}

This works. But, in some cases I have an API call where I get lots of information at once, for instance, information about an image with its user and comments:

{
    "mediaId": "1",
    "image": {
        "title": "myImage",
        "url": "http://image.com/234.jpg"
    },
    "user": {
        "username": "John"
    },
    "comments": [
        {
            "title": "Nice pic!"
        },
        {
            "title": "Great stuff."
        }
    ]
}

How would I go about creating a new User model and a Comments collection from here? This is an option:

parse: function(response) {
   var content = {};
   content.id = response.mediaId;
   content.image = response.image.url;
   content.user = new User(response.user);
   content.comments = new Comments(response.comments);
   return content;
}

The trouble here is, by creating a new User or new Comments with raw JSON as input, Backbone will just add the JSON properties as attributes. Instead, I’d like to have an intermediate parse-like method to gain control over the objects’ structure. The following is an option:

parse: function(response) {
    // ...
    content.user = new User({
        username: response.user.username
    });
    // ...
}

…but that’s not very DRY-proof.

So, my question is: what would be a nice pattern to create several models/collections out of 1 JSON response, with control over the models/collections attributes?

Thanks!

Answer 1

It may not be the nicest way possible, but this is how I do it:

content.user = new User(User.prototype.parse(response.user));

The only problem is that the this context in User.parse will be wrong. If you don’t have any specific code in the User constructor, you can also do:

content.user = new User();
content.user.set(user.parse(response.user));

I also noticed an interesting note in the Backbone version 0.9.9 change log:

The parse function is now always run if defined, for both collections and models — not only after an Ajax call.

And looking at the source code of Model and Collection constructor, they do it like so:

if (options && options.parse) attrs = this.parse(attrs);

Maybe upgrading to 0.9.9 will give you what you need? If upgrade is not an option, you can of course implement the same in your own constructor.