• Demos and Downloads!
• MooTools Plugins
• About / Contact

Method Chaining in MooTools and PHP

One of the great parts of most every JavaScript and PHP framework these days is the ability to chain class methods. I've gotten quite a few question about how this is possible so I want to cover the basics of allowing chaining in your own custom classes.

Lets first start by implementing some new methods on the MooTools Element class:

/* implement functionality */
Element.implement({
	doTaskA: function() {
		/* do stuff */
	},
	doTaskB: function() {
		/* do stuff */
	}
});

What the above methods actually do really isn't very important per this post. Now that you have these methods in place, you try the following:

/* Example */
$('myElement').doTaskA().doTaskB();

Good? Nope. You'll end up with the following error:

$('myElement').doTaskA() is undefined

What? doTaskA() definitely exists!! Why is this error occuring? While doTaskA() does exist, the method doesn't return anything.

The strategy for method chaining is returning a reference to the current object. How? Lets update the doTaskA() and doTaskB() methods to allow for method chaining:

Element.implement({
	doTaskA: function() {
		/* do stuff */
		return this;
	},
	doTaskB: function() {
		/* do stuff */
		return this;
	}
});

Returning this keeps the reference which in turn keeps the ability to chain alive. You can do the same thing in PHP:

public function doTaskA() {
	return $this;
}

public function doTaskB() {
	return $this;
}

/* usage */
$myObject->doTaskA()->doTaskB();

Class method chaining is a great way to keep your code condensed. Don't get too carried away with chaining though -- be sure to balance chaining with readability.

Discussion

The Bottom Line