JavaScript Function Parameters and Arguments

A function can also be declared with parameters. A parameter is a value that is passed when declaring a function. Parameters are additional information passed to a function.

The parameters are passed to the function within parentheses after the function name and separated by commas.

Earlier in this tutorial, you learned that functions can have parameters.

Function parameters are the names listed in the function definition.

Function arguments are the real values passed to (and received by) the function.

Working of JavaScript Function with parameter

JavaScript Functions can have 0 or more arguments.

We can call function by passing arguments. Below is the example of function that has one argument.

Contents hide
Example
Parameter Rules
Local Variables

Example

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript Function with Arguments</title>
    <script>
        function getcube(number) {
            alert(number * number * number);
        }  
    </script>
</head>

<body>
    <form>
        <input type="button" value="click" onclick="getcube(4)" />
    </form>
</body>

</html>

Notice that you can call a function as many times as you want. You can write one function and then call it multiple times with different arguments.

A function can take multiple parameters separated by comma.

Parameter Rules

  • JavaScript functions do not perform type checking on the passed arguments.
    • JavaScript is a dynamic type scripting language, so a function parameter can have value of any data type.
function ShowMessage(firstName, lastName) {
    alert("Hello " + firstName + " " + lastName);
}

ShowMessage("Steve", "Jobs");
ShowMessage("Bill", "Gates");
ShowMessage(100, 200);
  • JavaScript function definitions do not specify data types for parameters.
  • JavaScript functions do not check the number of arguments received.
    • You can pass less or more arguments while calling a function.
    • If you pass less arguments then rest of the parameters will be undefined.
    • If you pass more arguments then additional arguments will be ignored.
function ShowMessage(firstName, lastName) {
    alert("Hello " + firstName + " " + lastName);
}

ShowMessage("Steve", "Jobs", "Mr."); // display Hello Steve Jobs
ShowMessage("Bill"); // display Hello Bill undefined
ShowMessage(); // display Hello undefined undefined

Local Variables

Variables declared within a JavaScript function, become LOCAL to the function.

Local variables are created when a function starts, and deleted when the function is completed.

Local variables can only be accessed from within the function.

// code here can NOT use carName

function myFunction() {
  let carName = "Volvo";
  // code here CAN use carName
}

// code here can NOT use carName

Because local variables are only recognized inside their functions, variables with the same name can be used in different functions.

You will learn a lot more about local variables later in this tutorial.