Overloading Javascript Functions Using A Sub-Function Approach

I think you meant looser languages. PHP is the loser language :P

This is cool!

Another way of doing it (shorter version) -

function randRange(){
(randRange[arguments.length] || randRange[2]).apply(this, arguments);
}
randRange[0] = function () {
alert('Error: No parameters passed!');
return 0;
};
randRange[1] = function (max) {
return( randRange[2]( 0, max ) );
};
randRange[2] = function (max, min) {
return(
min +
Math.floor( Math.random() * (max - min) )
);
};

randRange();
randRange(1);
randRange(1, 2);
randRange(1, 2, 3); // calls the no-param version

Anyone see any problems using this approach?

Oops .. the comment in the last line of code above should read "calls the 2-param version" .. which I think is a better implementation considering that the randRange() function essentially wants to deal with maximum of 2 arguments .. any more should be ignored.

@All,

Besides number of arguments, there's also overloading by type of arguments. jQuery("a[name]") does one thing, jQuery(this) does something else and jQuery(function(){}) does something else.

This sort-of argues in favor of defining a hash of subfunctions, doesn't it? With a 2 dimensional hash and the typeof operator, you could deal with the combinatorial explosion of multiple argument types quite naturally:

subfuncs["boolean"]["boolean"]
subfuncs["boolean"]["string"]
subfuncs["boolean"]["number"]
subfuncs["string"]["number"]
subfuncs["string"]["boolean"]
etc.

It's like Java signatures, but managed out of a hash.

Nice how you get people thinking, Ben.

A (very) quick prototype of a cleaner way of doing (strict) arguments check for both - type and count -

Function.prototype.overload = function () {
this.variants = this.variants || {};
var len = arguments.length, args = (Array.prototype.slice.call(arguments)),
id = args.slice(0,len-1).join(',');
this.variants[id] = this.variants[id] || args[len-1];
};
Function.prototype.overloaded = function () {
var len = arguments.length, args = (Array.prototype.slice.call(arguments)),
id = [];
for (var i=0, len=args.length; i<len; i++) {
id.push(typeof(args[i]));
}
id = id.join(',');
var fn = randRange.variants[id];
if (randRange.variants && fn) {
fn.apply(fn, arguments);
}
};
function randRange(){
randRange.overloaded.apply(randRange, arguments);
}

randRange.overload(
'string', 'boolean', 'number',
function (mystr, mybool, mynum) {
alert(['String:'+mystr, 'boolean:'+mybool, 'Number:'+mynum].join('\n'));
}
);

randRange.overload(
'string', 'number', 'boolean',
function (mystr, mynum, mybool) {
alert(['String:'+mystr, 'Number:'+mynum, 'boolean:'+mybool].join('\n'));
}
);

randRange('abc', 100, true);
randRange('pqr', false, -1);
randRange(false, 'str', -1); // no "variant" matches .. call ignored.

This can also be enhanced to take in metadata about arguments like "mandatory/optional", default values, etc. -

randRange.overload(
'string[Default Value]', 'number:-1', 'boolean:optional',
function (mystr, mynum, mybool) {
...
}
);

What do you guys think?

I've done this a couple times in cfscript, when I wanted a conditional argument. I've also done something similar in cfc methods when a function contains most of the logic I want already, but I want to interact with it in different ways.

The advantage to cfc methods is that you can self document a bit better and if you choose you can use named arguments in your calls to tell "the next guy" what you're doing.

This is really cool - I love overloading and overriding in Javascript.

Just looking at some of the suggestions - you could also put the functions in an array, and then call the function based on the arguments.length which would be in the corresponding place in the array of functions...

function randRange(){
return randRange.Params[arguments.length-1].apply(this, arguments)
}
randRange.Params = [
function( max ){
return( randRange.Params[1]( 0, max ) );
},
function( min, max ){
return(min + Math.floor( Math.random() * (max - min) ))
}
];

This obviously has a little problem with error handling - ie: when there's no arguments - but that's easy enough to cater for.

So was the idea purely to work out a clean separation of functional intent for overloading? Otherwise why not keep is simple like so?

function randRange(arg1, arg2)
{
if (arg1 === undefined && arg2 === undefined) { return; }
else if (arg2 === undefined) { return (0 + Math.floor(Math.random() * (arg1 - 0))); }
else { return (arg1 + Math.floor(Math.random() * (arg2 - arg1))); }
}

Just wondering. Still a fun read as always Ben.

Nice thoughts on the subject,
A good use-case for overloading is when you are dealing with google maps, making a constructor for the market with assorted options (lat, lng, icon, text, function)

Seem to recall reading a post by jresig on the array approach, along the lines of the http://ejohn.org/apps/learn/#90 example

Lookimg forward to your further exploration