Share

Arguing for the sake of arguments in JavaScript

This article deals with some intricacies revolving around the arguments object, a magical and mysterious creature residing in the functional realms of the Javascript world, which can be summoned anytime in your code by the programming wizards without any spells, incantations or sorcery.

The arguments object is an Array-like object corresponding to the arguments passed to a function. It is a local variable available within all (non-arrow) functions.

We will also be discussing the different ways the arguments object can be put to use to solve various problems involving multiple argument functions.

Build a function that multiplies the first argument with the largest of the remaining arguments

As an example we will be looking to build a function that multiplies the first argument with the largest of the remaining arguments We’ll grab the first argument and multiply it by the biggest of the remaining argument values.

Clearly this problem requires an ingenious use of the arguments object of the function we are going to build, since this function takes variable number of arguments which is also known as a variadic function. Also this function obviously qualifies as a polyadic function since it requires multiple arguments.

Function Type No. of arguments Also known as
Niladic function 0 Nullary function
Monadic function 1 Unary function
Dyadic function 2 Binary function
Triadic function 3 Ternary function
Polyadic function Multiple n-ary function
Variadic function Variable

In mathematics and in computer programming, a variadic function is a function of indefinite arity, i.e., one which accepts a variable number of arguments.

The arity of a function or operation is the number of arguments or operands that the function takes.

So this gives us an useful insight such as whenever you are encountered with a problem of variadic functions in Javascript, most often the arguments object will be our savior.

Our general approach to this particular problem will be like this:

  • Convert the arguments object to a real array
  • Get the remaining arguments from this array excluding the first element
  • Sort the remaining arguments in descending order
  • Return the product of the first argument and the largest of the remaining (i.e, the first of the sorted )

ES5 – v1

The arguments object is not an Array. It is similar to an Array, but does not have any Array properties except length. However it can be converted to a real Array: using any one of the two below examples in ES5:

With the first method using Array.prototype.slice.call(arguments) we can write our program as:

With the second method using [].slice.call(arguments) the same program will be like:

ES5 – v2

In ES6, it is very easy to convert the arguments object to an array, using the Array.from()function.

ES6 – v1:

We can also use the spread operator to convert the arguments object like this:

ES6 – v2

Or we can also make use of , in ES6, rest parameters

ES6 – v3

Define a function that concatenates several strings

Our next problem we are going to take it for our discussion is to define a function that concatenates several strings. This example defines a function that concatenates several strings. The only formal argument for the function is a string that specifies the characters that separate the items to concatenate. The function is defined as follows:

Example use of this function will be like:

Define a function to compute the average of numbers

If you are planning to solve this problem more elegantly and functional way, we can make use of the Array reduce function to obtain the sum of the arguments once it has been converted to a real array like below.

If you want to go all guns blazing with ES6 spread operator and arrow functions, you may write.

Find the maximum number

The following function accepts any number of numeric arguments and returns the value of the largest argument it is passed (see also the built-in function Math.max(), which behaves the same way):

Verifying all named arguments are supplied

JavaScript’s liberal attitude to parameter passing is appealing but some functions will break if all named arguments are not supplied. We could write a function wrapper to enforce this when necessary:

Defining a function that creates HTML lists

This example defines a function that creates a string containing HTML for a list. The only formal argument for the function is a string that is “u” if the list is to be unordered (bulleted), or “o” if the list is to be ordered (numbered). The function is defined as follows:

You can pass any number of arguments to this function, and it adds each argument as an item to a list of the type indicated. For example:

A String formatter

Partial function application

The typical JavaScript implementations of curry, partial and compose store the arguments object for later concatenation with the runtime arguments of the inner function.

No binding of arguments inside ES6 arrow functions

An arrow function expression has a shorter syntax than a function expression and does not have its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.

Arrow functions do not have their own arguments object. Thus, in this example, arguments is simply a reference to the arguments of the enclosing scope:

In most cases, using rest parameters is a good alternative to using an arguments object.