0

I am trying to make super-class(MyShape) and sub-class(MyTriangle, MyRectangle). I already searched some backbone.js's polymorphism concept...but have no idea on this problem.

I hava a .json file like below

[
{
    "type": "rect",
    "x": 10,
    "y": 10,
    "w": 100,
    "h": 100,
    "color": "red"
},
{
    "type": "arc",
    "x": 210,
    "y": 20,
    "w": 200,
    "h": 150,
    "color": "blue"
}
]

And I made inheritance structure using backbone.js like below.

    var MyShape = Backbone.Model.extend({
        defaults : {
            color : '',
            src : '',
        }
    });

    var MyRectangle = MyShape.extend({
        defaults : {
            x : 0,
            y : 0
        }
    });

    var MyTriangle = MyShape.extend({
        defaults : {
            x : -10,
            y : -10
        }
    });

    var Collection = Backbone.Collection.extend({
        model : MyShape,
    });

As you can see above, the super class(MyShape) has color and src attributes. I hava a problem because of this. If I make MyTriangle instance I think I cannot use src or color attributes on that object.

Q.If I want to make a code like below(this example is Java Based), how should I code it?

    MyShape myShape = null;
    if (type.equals("rect")) {
        myShape = new MyRectangle(x, y, w, h);
    } else if (type.equals("arc")) {
        myShape = new MyArc(x, y, w, h);
    } else if (type.equals("triangle")) {
        myShape = new MyTriangle(x, y, w, h);
    } else {
        return null;
    }


    // option - src or color
    if (jsonObject.has("src")) {
        myShape.setImg(jsonObject.get("src").toString());
    } else if (jsonObject.has("color")) {
        myShape.setColor(jsonObject.get("color").toString);
    } else {
        return null;
    }

I have to maintain this structure(MyShape, MyTriangle, MyRectangle).

I really appreciate your help.

Pramod
  • 5,150
  • 3
  • 45
  • 46
Jinny Song
  • 125
  • 1
  • 10
  • 1
    Why do you ask for clarification of Backbone's polymorphism while directly limiting the answers to show how to do the polymorphism using your code? – try-catch-finally Nov 23 '15 at 05:45
  • *"If I make MyTriangle instance I think I cannot use src or color attributes on that object.*" - why do you think so..? what exactly do you mean by *use*?? – T J Nov 23 '15 at 06:35
  • If I do "var myshape = new MyTriangle();" then the type of myshpe is of course MyTriangle. That means, I cannot set the src or color attribute which is in the super class(MyShape). What I want to do is set the src or img while having their Shape Identity(MyTriangle or MyRectangle). Is it possible? – Jinny Song Nov 23 '15 at 06:56

1 Answers1

1

To use the default from parent class, you need to extend the defaults of parent class.

So, for example (source)

var MyRectangle = defaults : _.extend({}, MyShape.prototype.defaults, {
        x : 0,
        y : 0
     })
});

To use polymorphic models in backbone collection (source, similar question)

A collection can also contain polymorphic models by overriding this property with a constructor that returns a model.

var Library = Backbone.Collection.extend({

   model: function(attrs, options) {
     if (condition) {
      return new PublicDocument(attrs, options);
    } else {
    return new PrivateDocument(attrs, options);
    }
  }
});

An example putting it all together

Community
  • 1
  • 1
Sami
  • 3,926
  • 1
  • 29
  • 42
  • Thank you so much. It really helps me. – Jinny Song Nov 24 '15 at 01:14
  • In the 42-line, What is the second parameter, 'options' tough? – Jinny Song Nov 24 '15 at 01:25
  • Simply put `options` are optional arguments which can be passed as configuring function, contextual info (like which model or collection it belongs to) or additional data. For e.g. you can pass `comparator` as options. This [answer](http://stackoverflow.com/questions/8997714/what-is-options-in-backbone-js) will be helpful. See the default options for collection [here](http://backbonejs.org/docs/backbone.html#section-102) – Sami Nov 24 '15 at 09:13
  • @JinnySong please accept your answer if it solves your problem :) – Sami Dec 02 '15 at 09:52
  • Yes, I solved it. You were so helpful. Thanks a lot~ :) – Jinny Song Dec 03 '15 at 04:53
  • Thank you for letting me know this.~ – Jinny Song Dec 03 '15 at 09:29