Model Railroads: Part 2

Chugging right along, let’s continue working on our Model Railroad with Backbone.js. Last time, we looked into creating a model. Today, we’ll cover a few of the standard methods you can use within your Model class.

I’ve placed sample code at JS Bin where you can follow along. You can also scroll down to the bottom to see the Gist from this page.

Undefined Methods

Some methods in Backbone models are pre-defined, some aren’t, or at least they don’t do anything or they’re empty so you’re welcome to override them. My guess is that it’s better to have everyone using the same name for a constructor method such a initialize than using different ones like init, makeNew, createNew, whipUpNewModel, etc.

Initialize

initialize: function(){
  console.log('All aboard!');
  this.on('invalid', function(model, error){
    console.log(error);
  });
}

Initialize is a method invoked once your model in created. In my case,  the Railroad will output a message to the console when a model is created.

I sometime use initialize to take existing properties and convert them, such as maybe converting a string “3″ into an integer. However, if I wanted to just set properties instead of convert them, I’d probably want to use the defaults method.

Defaults

defaults: {
  conductor: 'Ringo Starr',
  owner: 'Sir Topham Hatt'
}

Defaults are where you can set default properties for your model. In our case, I’ve set defaults for the conductor and owner properties.

Validate

validate: function(attributes, options){
  if ('George Carlin' === attributes.conductor) {
    return "George can't make it. Using Ringo instead.";
  }
}

Validate is a method that by default is only called when you “save” a model*, but you can also call it if you set {validate:true} when you create a model.

Setting up validate is a little more complex than the other methods. In our case, we’re checking to see who is being set as the conductor. If the model tries to set George Carlin as the conductor, an invalid** event will trigger and the conductor property will not be set.

However, you need to listen for the invalid event to have something happen, such as an alert. In our case, from within the model, we are listening to this, and on the event of invalid, we log a message to the console.

Pre-defined Methods

Some methods are already defined, so if you call them, they will do something. Probably not a good idea to try to overwrite them.

Get

console.log('This railroad is operated by ' + this.get('conductor').toUpperCase() + '!');

Get is an easy one to explain. Get gets a model’s property. In our case, I’m using it in a custom method called shoutConductorName to get the conductor property to log a message to the console.

Set

railroad.set('conductor', 'George Carlin', {validate:true});

Set is for setting a model’s property. In our case, we’re using it to set the conductor to George Carlin. Note that we’ve added an option to set validate to true in addition to the attributes.

Custom Methods

You can create your own methods too. In our case, I’ve made a method called shoutConductorName. Note that when we call it after trying to set the conductor to George Carlin, Ringo Starr still appears as the conductor. That’s because when when we passed {validate:true} when we tried setting the conductor to George Carlin, the model did not validate and thus the new conductor name was never set.

That’s the basics for now. Hopefully we’ll get into more model methods tomorrow as we roll along. I hope these tutorials have been useful.


Discover more from AaronTweeton.com

Subscribe to get the latest posts to your email.