1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script
    src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
</head>
<body>

    <button id="cmd_create_event" name="cmd_create_event" type="button">Create
        a new `Event`</button>

    <script type="text/javascript">
        var EventModel = Backbone.Model.extend({
            initialize : function() {
                console.log("`Event` is initialized. id: " + this.cid);

                this.bind("change:status", function() {
                    console.log(this.get("status") + " is now the value for `status`");
                });

                this.bind("error", function(model, error) {
                    console.error(error);
                });
            },
            defaults : {
                "status" : 0
            },
            validate : function(attrs) {
                if (attrs.status <= 0)
                    return "invalid status";
            }
        });

        var EventList = Backbone.Collection.extend({
            initialize : function() {
                console.log("`EventList` is initialized");
            },
            model : EventModel,
            add : function(event) {
                console.log("`Event` added to `EventList`.");
            }
        });

        var EventView = Backbone.View.extend({});

        $(document).ready(function() {
            var event_list = new EventList();

            $("#cmd_create_event").click(function() {

                // GENERATION METHOD #1:
                /*var event = new EventModel();
                event.set({
                    status : 1
                });
                event_list.add(event);*/

                // GENERATION METHOD #2:
                event_list.add({
                    status : 1
                });

            });
        });
    </script>

</body>
</html>

在上面的代码中,我使用两种方法将一个添加EventModel到一个EventList.

方法 #1 会触发EventModel.initialize(),而方法 #2 不会。

文档说可以像方法 #2 一样添加对象,那么,为什么我不像我那样构造对象new EventModel()呢?引用文档:

如果定义了模型属性,您还可以传递原始属性对象,并将它们作为模型的实例进行激活。

4

1 回答 1

1

使用第一种方法,您实际上调用了模型的构造函数

var event = new EventModel();

使用第二种方法,您只需传递{ status: 1 }EventList.add您之前定义的方法,该方法仅记录到控制台并且不执行任何操作。

如果你打电话

Backbone.Collection.prototype.add.call(this, event);

在您的EventList.add方法中,Backbone 从传递的数据创建一个新模型实例initialize()并将被调用(因为您model在定义时指定了一个属性EventList)。

于 2012-07-07T15:15:03.013 回答