extend
Construct.extend([name,] [staticProperties,] instanceProperties)
Extends Construct
, or constructor functions derived from Construct
,
to create a new constructor function. Example:
var Animal = Construct.extend({
sayHi: function(){
console.log("hi")
}
});
var animal = new Animal()
animal.sayHi();
Parameters
- name
{String}
:Adds a name to the constructor function so it is nicely labeled in the developer tools. The following:
Construct.extend("ConstructorName",{})
returns a constructur function that will show up as
ConstructorName
in the developer tools. It also sets "ConstructorName" as shortName. - staticProperties
{Object}
:Properties that are added the constructor function directly. For example:
var Animal = Construct.extend({ findAll: function(){ return can.ajax({url: "/animals"}) } },{}); // need to pass an empty instanceProperties object Animal.findAll().then(function(json){ ... })
The static setup method can be used to specify inheritable behavior when a Constructor function is created.
- instanceProperties
{Object}
:Properties that belong to instances made with the constructor. These properties are added to the constructor's
prototype
object. Example:var Animal = Construct.extend({ findAll: function() { return can.ajax({url: "/animals"}); } },{ init: function(name) { this.name = name; }, sayHi: function() { console.log(this.name," says hai!"); } }) var pony = new Animal("Gertrude"); pony.sayHi(); // "Gertrude says hai!"
Returns
{function}
:
The constructor function.
var Animal = Construct.extend(...);
var pony = new Animal(); // Animal is a constructor function
Inheritance
Creating "subclasses" with Construct
is simple. All you need to do is call the base constructor
with the new function's static and instance properties. For example, we want our Snake
to
be an Animal
, but there are some differences:
var Snake = Animal.extend({
legs: 0
}, {
init: function() {
Animal.prototype.init.call(this, 'ssssss');
},
slither: function() {
console.log('slithering...');
}
});
var baslisk = new Snake();
baslisk.speak(); // "ssssss"
baslisk.slither(); // "slithering..."
baslisk instanceof Snake; // true
baslisk instanceof Animal; // true
Static properties and inheritance
If you pass all three arguments to Construct, the second one will be attached directy to the
constructor, allowing you to imitate static properties and functions. You can access these
properties through the this.constructor
property.
Static properties can get overridden through inheritance just like instance properties. In the example below, we override both the legs static property as well as the the init function for each instance:
var Animal = Construct.extend({
legs: 4
}, {
init: function(sound) {
this.sound = sound;
},
speak: function() {
console.log(this.sound);
}
});
var Snake = Animal.extend({
legs: 0
}, {
init: function() {
this.sound = 'ssssss';
},
slither: function() {
console.log('slithering...');
}
});
Animal.legs; // 4
Snake.legs; // 0
var dog = new Animal('woof');
var blackMamba = new Snake();
dog.speak(); // 'woof'
blackMamba.speak(); // 'ssssss'
Alternative value for a new instance
Sometimes you may want to return some custom value instead of a new object when creating an instance of your class. For example, you want your class to act as a singleton, or check whether an item with the given id was already created and return an existing one from your cache store (e.g. using constructor/store).
To achieve this you can return ReturnValue from setup
method of your class.
Lets say you have myStore
to cache all newly created instances. And if an item already exists you want to merge
the new data into the existing instance and return the updated instance.
var myStore = {};
var Item = Construct.extend({
setup: function(params){
if (myStore[params.id]){
var item = myStore[params.id];
// Merge new data to the existing instance:
Object.assign(item, params);
// Return the updated item:
return new Construct.ReturnValue( item );
} else {
// Save to cache store:
myStore[this.id] = this;
return [params];
}
},
init: function(params){
Object.assign(this, params);
}
});
var item_1 = new Item( {id: 1, name: "One"} );
var item_1a = new Item( {id: 1, name: "OnePlus"} )