Question

以下两行代码有哪些优缺点？我不明白为什么有两种不同的方法来做同样的事情。

this.listenTo(app.Todos, 'change:completed', this.filterOne);
app.Todos.on('change:completed', this.filterOne);

同样在使用.on时，如何确定是默认上下文？

Answer 1

listenTo是更新更好的选项，因为在stopListening期间会自动删除这些侦听器，当视图被删除时（remove()）会调用这些侦听器。在listenTo之前，幻象视图永远存在（泄漏内存并导致错误行为）存在一个非常隐蔽的问题，因为视图方法在模型上被引用为事件侦听器，即使视图实例本身已经过去而不再存在DOM。

如果您想阅读listenTo的背景故事，请在listenTo的骨干github存储库中搜索，并阅读一些较长的问题讨论。

对于默认上下文，有几件事可能最终绑定到this：

如果您通过this.listenTo进行绑定，它将始终是视图实例（Wim Leers在评论中指出）
没有this.listenTo，故事变得复杂
- 对于misc事件，它将是全局对象（最好避免这种情况）
- 对于DOM事件，它将像常规DOM事件绑定一样成为源元素
- 如果你提供一个明确的上下文（foo.on的第三个参数），骨干将使用它（因此这是一个更强大的方法）
- 如果您使用ECMA标准function () {//your event handler}.bind(this)，您也可以手动控制上下文（也推荐）
- 正如@mu指出的那样，_.bind或$.proxy是ECMA function.bind
- 对于骨干视图，当任何视图方法用作事件处理程序时，执行this.bindAll('onClick', ...)将确保视图实例是this上下文
使用视图的标准events属性连接的任何事件都将自动绑定到主干的视图实例（这是带bindAll的腰带和吊带

总结一些指导原则：

尽可能使用events属性，因为它简洁明了
对模型和集合的所有绑定使用this.listenTo
任何其他绑定都记得使用您的首选方法可靠地绑定上下文。我通常使用ECMA Function.bind，因为嘿，标准，但这里有几个不错的选择。

Answer 2

使用listenTo，将要侦听其事件的对象作为第一个参数传递。在on的情况下，它实际上是该对象的一种方法。

listenTo优于on的优点是：

监听器会跟踪所有事件处理程序，以便在需要时更容易将其全部删除。
回调的上下文始终设置为侦听器本身。

Backbone js .listenTo vs .on

2 个答案: