So I spent an entire day discovering a quirk about javascript that I must now share. In a previous post on creating default settings for classes/objects I discussed the following technique:
JavaScript:
var Widget = new Class({
initialize: function(element, options){
this.element = element;
this.options = Object.extend({
offsetX: 0,
offsetY: 0
}, options || {});
this.setPosition();
},
setPosition: function(){
this.element.setStyles({
left: this.options.offsetX + 'px',
top: this.options.offsetY + 'px'
});
}
});
initialize: function(element, options){
this.element = element;
this.options = Object.extend({
offsetX: 0,
offsetY: 0
}, options || {});
this.setPosition();
},
setPosition: function(){
this.element.setStyles({
left: this.options.offsetX + 'px',
top: this.options.offsetY + 'px'
});
}
});
Now, this isn't a very useful class, but it illustrates the technique. The functions in our class don't have to worry if the options are defined; they are either what the default value is or they are what the user passed in. If the user elects to just pass in a subset of the values, that's fine:
JavaScript:
var myWidget = new Widget(myElement, {offsetX: 100});
//myElement will be offset by 100 on the left,
//zero (the default) on the top
//myElement will be offset by 100 on the left,
//zero (the default) on the top
But what if you want to extend the functionality of your class later? What if you want to be able to insert more default options?
Here's what I was doing that caused me trouble: | Read the rest »
![PNG 1024x768 [111k]](http://www.snook.ca/files/mootools_83_snookca.png){kind=link}