JavaScript Programming

JavaScript – Creating Default Arguments

June 8, 2009

I ran into an interesting quirk with JavaScript yesterday, one I’m surprised I hadn’t noticed before.  JavaScript does not allow you to give arguments default values when defining functions.  So after a bit of tinkering, I came up with a solution.

function lorum(x, y) {

	if(typeof(x) == "undefined") {
		x = 100; 
	}
	if(typeof(y) == "undefined") {
		y = 500; 
	}
 
	// ...
}

Of course you could use a ternary operator if you prefer, however I know I’m not alone when I say that I do not like them. In any case, here’s an example using them:

function ipsum(i, j) {

	i = typeof(i) == "undefined" ? 100 : i; 
	j = typeof(j) == "undefined" ? 500 : j; 
 
	// ...
}

Despite its reduced code space, I prefer not to use them as they can be confusing at first glance. But to each his own.

Only registered users can comment.

  1. Two things. Undefined evaluates to false in an if statement and if statements can be put on a single line — with the proviso that the code executed in the positive case only takes up one line. This means you can set default values like this:

    if (!x) x = 100;
    if (!y) y = 500;

  2. What are the drawbacks to checking whether the variable exists more directly with:

    function ipsum(i, j) {

    i = i === undefined ? 100 : i;
    j = j === undefined ? 500 : j;

    // …
    }

  3. If i or j is meant to be set to 0 by the end-user, this code will not allow that:

    function tell_it(i, j){
    i = i === undefined ? 100 : i;
    j = j === undefined ? 500 : j;
    system.k7.shell.print(i);
    system.k7.shell.print(j);
    }

    function say_what(i, j){
    i = i || 100;
    j = j || 500;
    system.k7.shell.print(i);
    system.k7.shell.print(j);
    }

    system.k7.shell.print(‘—– say what’);

    say_what();
    say_what(1, 2);
    say_what(0, 3);

    system.k7.shell.print(‘—– tell it’);

    tell_it();
    tell_it(1, 2);
    tell_it(0, 3);

    Outputs:

    $ k7 js_is_cool.js
    —– say what
    100
    500
    1
    2
    100
    3
    —– tell it
    100
    500
    1
    2
    0
    3

  4. If i or j is meant to be set to 0 by the end-user, this code will not allow that:

    function tell_it(i, j){
    i = i === undefined ? 100 : i;
    j = j === undefined ? 500 : j;
    system.k7.shell.print(i);
    system.k7.shell.print(j);
    }

    function say_what(i, j){
    i = i || 100;
    j = j || 500;
    system.k7.shell.print(i);
    system.k7.shell.print(j);
    }

    system.k7.shell.print(‘—– say what’);

    say_what();
    say_what(1, 2);
    say_what(0, 3);

    system.k7.shell.print(‘—– tell it’);

    tell_it();
    tell_it(1, 2);
    tell_it(0, 3);

    Outputs:

    $ k7 js_is_cool.js
    —– say what
    100
    500
    1
    2
    100
    3
    —– tell it
    100
    500
    1
    2
    0
    3

  5. You should be declaring your variables with var inside the function, otherwise you’re creating global variables and are much more likely to have name collisions. vars inside a function are “private”, a variable declared within a function is not accessible outside of that function.

    function ipsum(i, j) {
    var i = i || 100;
    var j = j || 500;

    // or in one var declaration

    var i = i || 100, j = j || 500
    }

  6. The typeof === undefined comparision is better as it will not cause problems with boolean (or falsey) parameter values.

    function foo(flag){
    return flag || true;
    }

    flag(true) == flag(false) == flag();

    a corner case for sure, but certainly a failure case for the boolean operand strategy

  7. oops…

    function flag(flag){
    return flag || true;
    }

    flag(true) == flag(false) == flag();

  8. IMO it is more readable/understandable to use the “arguments” variable and it allows more flexibility. Something like:

    function lorum(/*x, y*/) {
    var x;
    var y;
    switch(arguments.length) {
    case 0 :
    x = 100;
    y = 500;
    break
    case 1 :
    x = arguments[0];
    y = 500;
    break
    case 2 :
    x = arguments[0];
    y = arguments[1];
    break;
    }
    // …
    }

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.