extend()

Clones a behavior and adds new properties to the clone.

Syntax

var mybehavior = behavior.extend(properties);

Example

var weekpicker = datepicker.extend({
  // tweak a datepicker to create a weekpicker
});

Notes

Inheritance

Behaviors support inheritance. You can override a behavior method and get access to the overridden method using this.base():

var first = jsb.behavior.extend({
  onclick: function(element, event) {
    console.log("first.onclick");
  }
});

var second = first.extend({
  onclick: function(element, event) {
    this.base(element, event);
    console.log("second.onclick");
  }
});

Feature Detection

jsb is built on top of base2. That means that you can use base2’s built-in feature detection:

var painter = jsb.behavior.extend({
  onclick: function() {
    this.drawPicture();
  },
  
  drawPicture: function() {
    throw "This browser does not support the drawing of images.";
  },

  "@MSIE": {
    drawPicture: function() {
      // use VML to draw the picture
    }
  },

  "@(document.createElement('canvas').getContext)": {
    drawPicture: function() {
      // use a canvas element to draw the picture
    }
  }
});

In the example above, the default behavior is to throw an error if drawing is not supported. If you are using Internet Explorer then the method is overridden to use VML. If the browser supports the <canvas> element then the method is overridden again to use that. This gives you the ability to easily provide fallback functionality.

base2 and jsb will take care of most cross-browser issues for you but there are still times when you may need to tweak behavior according to the browser platform.

See Also