What are arguments?

Function definition and invocation statements have parentheses in them not without some purpose. These paretheses are used to create arguments or parameters in functions.
Arguments or parameters are suppliers of data to functions.
But what is the meaning of suppliers of data? Arguments in JavaScript are just like variables, in fact they are local scoped variables, that may be filled i.e given values when functions are called. The function definition being called can take the argument values supplied and use them in any way just like normal variables. Arguments are also known as parameters and can be of any data type (since they are variables).

Didn't understand anything? Let's go step by step.

Arguments in action

For the greeting function we created in the previous chapter, we can give it our name as an additional data.
function greeting(name) {
    alert("Hello " + name);
}

greeting("Drake"); // Hello Drake
Inside the function definition's paretheses we have the name of the argument just like we have the name of a variable. In this case we have an argument with name name. When this function is execute all arguments will be replaced with their values.

Inside the function call statement's parentheses we have the value of the corresponding argument which as we said can be of any type. In this case we have the value ofname as Drake

The above code with arguments is much like this except that we can't change the variable name with function calls here. Each time we call greeting we get the same alert and to change this we will have have to manually change the value of name.
function greeting() {
    var name = "Drake";
    alert("Hello " + name);
}

greeting(); // Hello Drake
So you can see that arguments are more useful and powerful than using manually variables as they are supplied each time at function invocations and therefore can be used to produce different results.
function greeting(name) {
    alert("Hello " + name);
}

greeting("Drake"); // Hello Drake
greeting("Bill"); // Hello Bill
greeting("Sandra"); // Hello Sandra

Multiple arguments

To add multiple arguments to a function just add them with their names and values seperated by commas in the respective places. The order in which arguments come inside the function definition has to be the same order in which arguments come inside the function call statement to give respective arguments their respective values.
function perc(marks, outof) {
    console.log((marks / outof) * 100 + "%");
}

perc(25, 50); // 50%
perc(50, 25); // 200%
Here in line 6 we meant to denote 25 as the numerator and 50 as the denominator and expected 50 as the output but didn't get it. This is because argument values are assigned based on order. The first parameter is for marks and the second one is for outof as mentioned inside the function definition.

Arguments in anonymous functions

In the previous chapter we looked at anonymous functions - how they are created, the significance of enclosing parentheses etc. Now we look at how to add arguments to these class of functions. The whole idea is the same i.e names go in definition and values in call.
(function(name) {
    alert("Hello " + name);
})("Drake");
In line 1 we have the name name and in line 3 we have the value Drake.

More on arguments

arguments object

One useful feature in JavaScript functions is the arguments local object which is accessible only inside functions. It contains information about the provided arguments such as their values, the total number of arguments etc. You might sometime need to use them in actual code so let's get them dealt with too.
function perc(marks, outof) {
    if (arguments.length !== 2) { console.log("Two params required!"); }
    else { console.log((marks / outof) * 100 + "%"); }
}

perc(25, 50); // 50%
perc(25); // Two params required!
So basically what this code is doing is simply checking if the user has called the function with 2 arguments. If yes the percentage is logged or else a message is logged.

Multiple functions, same argument names

Arguments are local scoped variables i.e they are accessible only inside functions. This means that multiple functions in a script can have identical argument names and still work properly since each function has its own variable scope that dies after the function completes execution.
function greeting(name) {
    console.log("Hello " + name);
}
greeting("Bill"); // Hello Bill

function logName(name) {
    console.log(name);
}
logName("Drake"); // Drake
Global variable names can also conincide with function parameter names.
var name = "John";
console.log(name); // John

function logName(name) {
    console.log(name);
}
logName("Drake"); // Drake

console.log(name); // John

And with all this you are done with function arguments.