Backbone 0.9.9: listenTo和on的区别

Question

我正在努力学习 Backbone 0.9.9 中的新变化。

目前我遇到了解释 listenTo 和 on 的不同之处的问题：

listenTo

var View = Backbone.View.extend({

    tagName: "div",

    intialize: function() {
        this.listenTo(this.model, 'change', this.render);
    },

    render: function() {
        this.$el.empty();
        this.$el.append('<p>hello world</p>');
    }

});

在

var View = Backbone.View.extend({

    tagName: "div",

    intialize: function() {
        this.model.on('change', this.render, this);
    },

    render: function() {
        this.$el.empty();
        this.$el.append('<p>hello world</p>');
    }

});

我听说listenTo与stopListening一起使用可以在例如视图被移除以避免内存泄漏时取消订阅所有事件。

这是唯一的原因吗？

- bodokaiser

---

可能是Backbone js .listenTo vs .on的重复问题。 - Emile Bergeron

Answer 1

当您创建视图时，listenTo和on都会添加事件处理。然而，当视图被销毁时，listenTo调用将自动删除事件处理程序。这可以防止内存泄漏和僵尸事件侦听器。

因此，如果您想自己管理处理程序，请使用on。只需确保调用off。否则，请调用listenTo。

- Richard

Answer 2

listenTo和stopListening这两个方法实际上来自社区，它们有助于更轻松地绑定和解绑事件。

关于这个想法已经有很多现有的文档和博客文章，包括我在这个主题上写的一些东西。

Johnny Oshika是我看到使用这种技术的第一个人。最初，它作为答案发布在StackOverflow上的一个问题中，链接在这里：Backbone.js：重新填充或重新创建视图？

你可以在这里阅读我对此的写作：

• Backbone.EventBinder：更好的管理Backbone应用程序事件
• 僵尸！跑！（管理Backbone应用程序中的页面转换）
• Backbone.js和JavaScript垃圾收集

- Derick Bailey

---

我也正在学习这个，所以这是一个及时的问题。现在推荐的做法是使用listenTo来绑定所有可能需要在应用程序生命周期内解除绑定的事件吗？ - user1031947

这是一个很好的问题，最好能够得到一个更直接的答案。 - ErichBSchulz

@ErichBSchulz同意，尽管他在发表的三篇博客文章中没有提到listenTo，但我猜@DerickBailey是在说是的，使用listenTo而不是on。 - AJP

请查看这篇更新的文章：http://lostechies.com/derickbailey/2013/02/06/managing-events-as-relationships-not-just-references/。 - Derick Bailey