title: Disappearing models in Backbone collection
body: <p>I've got a Backbone model <code>line</code> that contains a collection of the model <code>Stop</code>.
  At some point, I want to iterate through the stops in the line and get the total travel time along the line, using the Underscore function <code>reduce</code>.</p>
  
  <p>This does not work, however. It seems that something happens with the collection at some point.
  It seems to contain only one object without meaningful attributes, although I know for a fact that it has been populated with four stop-models with valid attributes.</p>
  
  <p>The model:</p>
  
  <pre><code>App.models.Line = Backbone.Model.extend({
      initialize: function() {
          var stops = new App.models.Stops({
              model: App.models.Stop,
              id: this.get("id")
          });
          stops.fetch();
          this.set({
              stops: stops
          });
          this.set({unique: true});
          this.calculateTotalTime();
      },
      calculateTotalTime: function() {
          this.get("stops").each(function(num) {
              console.log("Model!");
          });
          console.log("Unique: ", this.get("unique"));
      }
  });
  </code></pre>
  
  <p>Console printout is:</p>
  
  <pre><code>Model!
  Unique:  true
  </code></pre>
  
  <p>There should be four "Model!", since the number of models is four.</p>
  
  <p>The strangest thing is that everything works just fine in the console:</p>
  
  <pre><code>window.line.get("stops").each(function(num) {
              console.log("Model!");
          });
  Model!
  Model!
  Model!
  Model!
  </code></pre>
  
  <p>The JS is compiled with Sprockets:</p>
  
  <pre><code>//= require ./init
  
  //= require ./lib/jquery
  //= require ./lib/underscore
  //= require ./lib/backbone
  //= require ./lib/raphael
  
  //= require_tree ./controllers
  //= require_tree ./models
  //= require_tree ./views
  
  //= require ./main
  </code></pre>
  
  <p>init.js:</p>
  
  <pre><code>window.App = {};
  App.views = [];
  App.models = [];
  </code></pre>
  
  <p>main.js:</p>
  
  <pre><code>$(function() {
    window.line = new App.models.Line({name: "4", id: 4});
    window.lineView = new App.views.Line({model: line});
    $("#outer").append(lineView.render().el);
  });
  </code></pre>
  
  <p>Some other strange behaviour:</p>
  
  <p><code>console.log(this.get("stops"))</code> in the model yields this fairly normal object:</p>
  
  <pre><code>child
    _byCid: Object
    _byId: Object
    _onModelEvent: function () { [native code] }
    _removeReference: function () { [native code] }
    id: 4
    length: 4
    models: Array[4]
      0: Backbone.Model
      1: Backbone.Model
      2: Backbone.Model
      3: Backbone.Model
    length: 4
    __proto__: Array[0]
    __proto__: ctor
  </code></pre>
  
  <p>But calling <code>console.log(this.get("stops").models)</code>, which should yield the array, returns only this, an array of a single object with no useful attributes:</p>
  
  <pre><code>[
    Backbone.Model
    _callbacks: Object
    _changed: false
    _changing: false
    _escapedAttributes: Object
    _previousAttributes: Object
    attributes: Object
      id: 4
      model: function (){ return parent.apply(this, arguments); }
      __proto__: Object
      cid: "c1"
      id: 4
    __proto__: Object
  ]
  </code></pre>
  
  <p>I suspect this is all down to some misunderstanding about the nature of <code>this</code>. Glad for any help provided.</p>