Frontend
Parameters and Arguments in JavaScript
ABISHEK M DEV Community
3 views
When working with JavaScript functions, you will often hear two terms: parameters and arguments.
They are closely related, but they have different meanings.
What is a Parameter?
A parameter is a variable that we define inside the function's parentheses when creating a function.
It acts as a placeholder for the value that the function will receive.
Example
function greet(name) {
console.log("Hello " + name);
}
Here, name is a parameter.
We haven't given name an actual value yet. It is simply waiting to receive a value.
function greet(name)
↑
Parameter
What is an Argument?
An argument is the actual value that we pass to a function when calling it.
Example
greet("Abishek");
Here, "Abishek" is an argument.
The argument "Abishek" is passed to the parameter name.
greet("Abishek")
↑
Argument
So, when the function runs:
function greet(name) {
console.log("Hello " + name);
}
greet("Abishek");
The value "Abishek" is assigned to the parameter name.
Output:
Hello Abishek
Parameter vs Argument
Parameter
Argument
Defined in the function definition
Passed during function call
Acts as a placeholder
Contains the actual value
Example: name
Example: "Abishek"
Receives the value
Gives the value
Simple Example
function add(a, b) {
console.log(a + b);
}
add(10, 20);
Here:
a → Parameter
b → Parameter
10 → Argument
20 → Argument
The flow is:
Function Definition
function add(a, b)
↑ ↑
Parameters
Function Call
add(10, 20)
↑ ↑
Arguments
The values are passed like this:
a ← 10
b ← 20
Therefore:
10 + 20 = 30
Output:
30
Example with Multiple Arguments
A function can have multiple parameters and arguments.
function introduce(name, age, city) {
console.log(name);
console.log(age);
console.log(city);
}
introduce("Abishek", 22, "Chennai");
Parameters
name
age
city
Arguments
"Abishek"
22
"Chennai"
The values are matched based on their position:
name ← "Abishek"
age ← 22
city ← "Chennai"
What Happens If We Don't Pass an Argument?
If a parameter doesn't receive a value, JavaScript gives it the value undefined.
function greet(name) {
console.log(name);
}
greet();
Output:
undefined
Because we called the function without passing an argument.
Default Parameters
We can also provide a default value for a parameter.
function greet(name = "Guest") {
console.log("Hello " + name);
}
greet();
Output:
Hello Guest
Here, if no argument is passed, "Guest" is used as the default value.
If we pass an argument:
greet("Abishek");
Output:
Hello Abishek
The passed argument replaces the default value.
Final Summary
Parameter
↓
Placeholder defined in function
Argument
↓
Actual value passed during function call
Read original: https://dev.to/abishek_m_82/parameters-and-arguments-in-javascript-5cnl
← Previous
Why AI Agents Disappear in Production (and How to Keep Them Running for $5.70/Month)
Next →
OpenAI confirms ‘wiki incident,’ says it’s ‘working on a framework’ for more disclosure
Related
Your Flutter 404 Page Is Probably Crashing, and Your Server Is Probably Lying About It
Frontend
1
DEV Community
how I make my templates easy to reskin (probably overthought this)
Frontend
2
Dev.to (EN Zone)
StyleX won CSS-in-JS because AI agents can read it
Frontend
2
DEV Community
Why I Built a Lightweight Utility Styling Library for React Native (And How It Solves StyleSheet Fatigue)
Frontend
2
DEV Community
Comments0
No comments yet — be the first