javascript - Backbone Marionette : put methods on instance/constructor or prototype when extending objects

标签 javascript inheritance backbone.js prototype marionette

我必须从头开始制作一个主干+ Marionette 网络应用程序,这是我从未做过的,而且我正在努力解决基本的代码结构。

我理解 JavaScript 的概念,即在构造函数(为每个实例重新创建)或原型(prototype)(在实例之间共享)上拥有方法。

但是,在扩展 Backbone 模型和 Marionette View 时,我正在努力弄清楚如何将其转化为最简单的语法来完成这项工作。

这篇文章似乎详细解释了我的问题,但是它们最终用来扩展 View 的语法非常复杂,我决定在 Backbone 之上使用 Marionette 的原因是抽象出这样的结构代码并利用它们的优势更高级的 View 类型:

http://blog.scottlogic.com/2012/12/14/view-inheritance-in-backbone.html

Marionette “选项”似乎是一种将属性附加到实例或原型(prototype)的方法,但我不确定如何在示例中使用它们:

http://marionettejs.com/docs/v2.4.5/marionette.functions.html#marionettemergeoptions

假设我想构建一个从 Marionette CompositeView 扩展的 CaseView 并具有 learnerCompleted 方法。我希望 learnerCompleted 方法继续用于我的 CaseView 原型(prototype),因为我不希望为 600 个案例 View 实例中的每一个实例重新创建该方法。但是,我不希望 learnerCompleted 方法继续用于 Marionette CompositeView 原型(prototype),因为我有另一个 View 类型 CategoryView,它也从 Marionette CompositeView 扩展,但不需要 learnerCompleted 方法。

通过利用内置的 Marionette 功能实现此目的最简单的语法是什么?我认为 scottlogic 博客文章提供了一个解决方案,但语法很复杂,我想知道是否有更简单的方法使用内置 Marionette 实用程序来实现相同的目的。

非常感谢您的帮助!

最佳答案

您可以通过扩展 Marionette 的 CompositeView 并指定 learnerCompleted 函数来实现此目的。

var CaseView = Backbone.Marionette.CompositeView.extend({
  learnerCompleted: function() {
    /* ... */
  }
});

var CategoryView = Backbone.Marionette.CompositeView.extend({
});

通过上述内容,learnerCompleted 函数被放置在 CaseView 原型(prototype)上,而不是 Marionette 的 CompositeView 上。因此,没有为您的 CategoryView 定义 learnerCompleted 函数。

我创建了一个简单的 fiddle 来显示:https://jsfiddle.net/jdrap2yk/

关于javascript - Backbone Marionette : put methods on instance/constructor or prototype when extending objects,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37436636/

相关文章:

javascript - crypto.sign Text() 不要求用户提供证书

backbone.js - 在 r.js 构建 Backbone 和 Handlebars 之后,App Loader 中未定义

javascript - 如何使用 backbone js 添加 css 属性 onclick 事件

backbone.js - 原型(prototype)设计:最简单的带有 URL 路由的 HTTP 服务器(与 Backbone.Router 一起使用)?

java - 如何通过多级继承调用错误的override方法?

javascript - 将多维 Javascript 数组保存到服务器端 CSV

javascript - jQuery html5音频移动后退或前进快捷方式

javascript - typescript :使用联合类型映射对象值无法按预期工作

C++ 动态对象构造

node.js - Node.JS 中的继承