You can think of parameters as variable names listed in the function definition, which act as placeholders for the values or arguments that will be passed into the function when it is called. On the other hand, arguments are the concrete values that are substituted for these placeholders when the function is actually invoked.
What Is the Difference Between Arguments and Parameters
function greet(name) {
a;
console.log(`Hello ${name}`);
}
greet("Homer"); // "Hello, Homer"
In the example above, the function greet is declared with a parameter name. Then, when the function is invoked using greet("Homer"), the argument "Homer" is passed in, and replaces the parameter in the body of the function.
While the terms parameters and arguments can sometimes be used interchangeably in some contexts, they refer to two distinct concepts in function invocation - parameters are defined by the function, and arguments are passed to it. See this StackOverflow thread for more on this terminology. Though a good way to remember it is:
"You define parameters, and you make arguments." – Greg M. Krsak (StackOverflow User)
How to Use Parameters and Arguments
Parameters are used when defining and function and arguments are used when calling said function.
Create Functions With Parameters
When you create a function you can have zero parameters or you can have many. Here is an example of both:
let sum = 0;
function resetSum() {
sum = 0;
}
function addProductToSum(number1, number2) {
let product = number1 * number2;
sum += product;
}
Call Functions With Arguments
Arguments are provided when calling the function and are passed between parentheses. In the example provided above, you set up a variable sum that will be manipulated by a couple of functions resetSum and addProductToSum. This might be used in the following way:
addProductToSum(50, 50);
console.log(sum); // 2500
addProductToSum(50, 50);
console.log(sum); // 5000
resetSum();
console.log(sum); // 0
This script would be used to multiply two numbers together and add the result of the multiplication to the sum. It would keep on adding until you resetSum, which sets sum as 0.
resetSum has no parameters, it just sets the variable sum to 0 and doesn't need any instruction. addProductToSum has two parameters, number1 and number2, which represent the two numbers to multiply together and add to sum.
Summary: What Are JavaScript Arguments and Parameters
- Parameters are defined when you create a function
- Parameters act as placeholders
- Arguments are the actual data passed when the function is called
- Arguments are provided when calling the function and are passed between parentheses