Call apply method with arguments in JavaScript

javascript arguments apply
dkugappi picture dkugappi · Oct 6, 2011 · Viewed 29.5k times · Source

I wanted to invoke a function using the javascript apply() method. This works fine if the function has no arguments. i.e.

function test()
{
  console.log(this);
}

body = document.getElementsByTagName("body")[0]; // shortcut to body element

test.apply(body); // returns [object HTMLBodyElement]

But I can't seem to do the same thing to invoke a function that has arguments:

function test(msg)
{
  console.log(msg);
}

body = document.getElementsByTagName("body")[0]; // shortcut to body element

test(this).apply(body); // mysteriously returns the correct result, then
// typeError: 'undefined' is not an object (evaluating "test(this).apply".

The examples above are completely trivial but the grain of my question is: How do I use the apply() method to invoke a function with arguments.

Answer

John Keyes picture John Keyes · Oct 6, 2011

apply takes two arguments:

test.apply(null, [body]);

The first argument sets the value of this when the function is executed. The second is an array of parameters for that function.

In your examples you could rewrite it as follows:

function test() {
    console.log(this);
}

and call it as follows:

test.apply(this);

Related questions

Set a default parameter value for a JavaScript function

I would like a JavaScript function to have optional arguments which I set a default on, which get used if the value isn't defined (and ignored if the value is passed). In Ruby you can do it like this: def …

Read More
How do I pass command line arguments to a Node.js program?

I have a web server written in Node.js and I would like to launch with a specific folder. I'm not sure how to access arguments in JavaScript. I'm running node like this: $ node server.js folder here server.js …

Read More
Is there a better way to do optional function parameters in JavaScript?

I've always handled optional parameters in JavaScript like this: function myFunc(requiredArg, optionalArg){ optionalArg = optionalArg || 'defaultValue'; // Do stuff } Is there a better way to do it? Are there any cases where using || like that is going to fail?

Read More