How to make chainable function in JavaScript?

Question

Lets imagine function like this:

function foo(x) {     x += '+';     return x; } 

Usage of it would be like:

var x, y; x = 'Notepad'; y = foo(x); console.log(y); // Prints 'Notepad+'. 

I'm looking for a way to create function that's chainable with other functions.

Imagine usage:

var x, y; x = 'Notepad'; y = x.foo().foo().toUpperCase(); // Prints 'NOTEPAD++'. console.log(y); 

How would I do this?

Answer 1

Sure, the trick is to return the object once you're done modifying it:

String.prototype.foo = function() {     return this + "+"; }  var str = "Notepad"; console.log(str.foo().foo().toUpperCase()); 

http://jsfiddle.net/Xeon06/vyFek/

To make the method available on String, I'm modifying it's prototype. Be careful not to do this on Object though, as it can cause problems when enumerating over their properties.