javascript - Backbone: Why are events syntax quite different between model and view? -

define events in backbone.model

var todo = backbone.model.extend({   initialize: function(){     this.on('change', function(){         console.log('- values model have changed.');     });   } }) 

define events in backbone.view

var todoview = backbone.view.extend({   classname: "document-row",   events: {     "click .icon":          "open",     "click .button.delete": "destroy"   } }) 

my question

define events syntax quite different between model/collection , view, why designed in way?

i think it's better define model event this. backbone don't support it.

var todo = backbone.model.extend({   events: {     "change": "foo"   },    foo: function(){     console.log("test")   } }); 

there 2 separate type of events: backbone.events , jquery dom events - making these same seems bad idea make code confusing not mention wouldn't work because view ui events need different info: '<eventname> <optional dom selector>: <methodname>' whereas normal internal events have different syntax.

backbone.events follows typical "publish/subscribe" pattern - it's way apps internally "something has happened" via .trigger , "i want know when happens" via .on or .once , equivalent use in view because handles cleaning listen when view removed: .listento , .listentoonce.

so in example "change" event in model internal event backbone fires when attribute changes. "change" in view jquery dom event (actually delegate event) , optionally listen deeper in view "change .myinput" not equivalent.

the other difference .trigger can pass arguments likes after first 1 (the event name), whereas view event passes dom event object don't control e.g. onchange: function(ev) { ev.preventdefault(); }.