Question

我从backbone.js

开始

通过一些教程，如下所示。我有这种感觉，它更多的是关于如何组织对象以及如何指导它们进行交互。而且我可以在没有backbone.js的情况下完成它们所以backbone.js看起来更像是一套规则，对我而言是哲学，然后是大多数实际的插件。这是什么？

(function($){
  var Item = Backbone.Model.extend({
    defaults: {
  part1: 'hello',
  part2: 'world'
  }
 });      

 var List = Backbone.Collection.extend({
    model: Item
 });

var ListView = Backbone.View.extend({
el: $('body'),
events: {
  'click button#add': 'addItem'
},
   initialize: function(){
  _.bindAll(this, 'render', 'addItem', 'appendItem'); // remember: every function that uses 'this' as the current object should be in here

  this.collection = new List();
  this.collection.bind('add', this.appendItem); // collection event binder

  this.counter = 0;
  this.render();      
},
render: function(){
  $(this.el).append("<button id='add'>Add list item</button>");
  $(this.el).append("<ul></ul>");
  _(this.collection.models).each(function(item){ // in case collection is not empty
    appendItem(item);
  }, this);
},
// `addItem()` now deals solely with models/collections. View updates are delegated to the `add` event listener `appendItem()` below.
addItem: function(){
  this.counter++;
  var item = new Item();
  item.set({
    part2: item.get('part2') + this.counter // modify item defaults
  });
  this.collection.add(item); // add item to collection; view is updated via event 'add'
},
// `appendItem()` is triggered by the collection event `add`, and handles the visual update.
appendItem: function(item){
  $('ul', this.el).append("<li>"+item.get('part1')+" "+item.get('part2')+"</li>");
}
});

var listView = new ListView();
})(jQuery);

Answer 1

Backbone.js，underscore.js和jQuery（它们都是相互依赖的）是一个实用的抽象层和javascript工具集，允许您组织业务逻辑，模板和模型。

这样做的主要好处是代码可读性（适用于具有多个成员的长期项目/项目），围绕离散部件组织的一般良好实践（例如，保持HTML不受业务逻辑影响），提供工作的时间项目的硬/有趣部分，而不是在不同的浏览器兼容性问题上重新发明轮子，以及（在下划线的情况下）一个很棒的工具集，可以帮助您管理javascript对象，数组，函数等，以实现安全和合理的编程

基本上，如果您选择不使用这些工具，那么您要么在原型上进行原型设计，要么在世界各地拥有所有时间。如果您喜欢时间和理智，请不要害怕使用它们！

Answer 2

Backbone提供了更清晰的关注点分离，使您可以编写更清晰的代码。我使用jQuery编写了一个非常精细的富客户端，没有主干。我必须直接在DOM元素上存储大量元数据。这意味着我还必须定期查询我的DOM元素以读取/使用该元数据。虽然你可以使用你所拥有的工具做任何事情，但有些工具可以使事情变得更容易（也更清洁）。

使用Backbone，您的模型会存储所有相关信息。您不需要在DOM属性中存储尽可能多的东西。每个模型只存在一次，因此任何一个事实（例如给定人模型的first_name）都有一个单一的真实点，即模型本身。您正在使用该模型来跟踪自己的事实，而不是DOM。我保证你的代码会更清晰。

Backbone不是所有东西的工具。在浏览器中表示模型（后端数据库中存在的东西）时使用它是有意义的。

Answer 3

你很开心，它主要是关于如何构建大型js应用程序的理念，所有的管道都是为你处理的。

Backbone仍然处于起步阶段，但它有很大的吸引力。即使你现在没有太深刻的印象，我也会留意它。

Answer 4

我要说Backbone.js提供的主要功能实际上是事件模型。是的，可以手工编写，因为它是一个非常简单的模型。

对于Spine.js，一个非常相似的库，我会说它提供的另一个功能是Class，一个围绕javascript原型的包装。

那就是说，我想有很多重要的警告你想要做对。这些警告除其他外：

您的活动到底是什么时候触发的？
- 是否自动检测到Backbone.js？
- 或者你想在Spine.js中通过调用save（）
如果在响应事件时触发了两个函数并且它们接收到模型实例：
- 他们是否收到相同的实例 - 即其中一人所做的更改将立即显示给另一人
- 或者他们会收到某种副本吗？如果是副本：
  - 他们会对模型的未来变化作出反应，
  - 或者他们不会
列表继续......

令人惊讶的是，很多事情都是正确的。我肯定有偏见，因为我发现Backbone.js做出的选择非常麻烦。我非常喜欢Spine.js。但是，我鼓励您为这两个库寻找一些非常重要的用例示例，并为自己做好准备。

继续自己实现所有这些可能是正确的选择 - Spine.js核心只有2KB的缩小代码。但是我强烈建议你尝试学习别人的错误。我认为有很多事情要出错。

Backbone.js或其他MVC提供什么？

4 个答案: