JavaScript Arguments

The arguments object in JavaScript is a local variable in any function that provides some nice features we can use in our code. Here is the list of its properties and related properties of the Function object.

arguments itself returns an object that looks like an array (but not really an array) of the arguments passed to the function.

Prior to JavaScript 1.4 the Function object also had a similar arguments property, which is now deprecated.

However the Function object comes with a few other useful properties that we can still use to get argument related data.

function callTaker(a,b,c,d,e){
  // arguments properties
  console.log(arguments);
  console.log(arguments.length);
  console.log(arguments.callee);
  console.log(arguments[1]);
  // Function properties
 console.log(callTaker.length);
  console.log(callTaker.caller);
  console.log(arguments.callee.caller);
  console.log(arguments.callee.caller.caller);
  console.log(callTaker.name);
  console.log(callTaker.constructor);
}
 
function callMaker(){
  callTaker("foo","bar",this,document);
}
 
function init(){
  callMaker();
}

For demonstration purposes, you can run the init function above and view the logs in FireBug.

arguments object and its properties

arguments returns ["foo", "bar", Window, Document]

arguments.length returns 4

Note: even though our function has a signature with 5 arguments, length returns only 4 here. This is because the caller sent us only 4 arguments. See below for how we can use Function’s length property to find the number of expected arguments.

arguments.callee returns callTaker(a, b, c, d, e)

Note: callee shows us the signature of the currently executing function and is useful when trying to make recursive calls to a function within its own body.

arguments[1] returns bar

Note: arguments can also be set for functions in an array like format. For example you can set the second argument like this: arguments[1] = 'moo';

Function object and its argument related properties

callTaker.length returns 5

Note: This is the expected number of arguments.

callTaker.caller is the same as arguments.callee.caller and returns callMaker()

Note: we can go up the stack trace and get the caller of the caller etc. For example we can find the function that called callMaker using arguments.callee.caller.caller which returns init().

callTaker.name returns callTaker

callTaker.constructor returns Function()

Note: Since we have not modified the basic behavior, we see the built in function that creates an object’s prototype for our function, which is the Function object.

Basic Usage Sample

var dataArray = ["One", "Two", "Three", "Four"];
 
var lister = function createList(list) {
 if(arguments.length == 3){
  var result = "<" + arguments[1] + ">";
  for (var i = 0; i < arguments[2].length; i++){
   result += "<li>" + arguments[2][i] + "</li>";
  }
  result += "</" + arguments[1] + "l>";
  document.getElementById(arguments[0]).innerHTML = result;
 }
}
 
function makeList(){
 lister("list_HTML","ul",dataArray);
}

Run the sample

References:
JavaScript Stack Trace
Function
arguments