JavaScript Functions
JavaScript function parameters are the names listed when a function is defined.
The values you actually pass in when calling the function are called arguments.
Parameters work like variables that only exist inside the function.
Example
javascript
function greet(name, city) {
return "Hello " + name + " from " + city;
}
console.log(greet("Ada", "London"));Here, name and city are parameters.
"Ada" and "London" are the arguments.
A parameter is the name in the function definition.
An argument is the real value passed in when the function is called.
The two words are often mixed up, but the difference is simply definition versus call.
Syntax
javascript
function name(parameter1, parameter2) {
// code to run
}
name(argument1, argument2);Separate each parameter and each argument with a comma.
Arguments are matched to parameters by position, not by name.
Example
javascript
function describe(name, age) {
return name + " is " + age;
}
console.log(describe("Ada", 36));
console.log(describe(36, "Ada"));The second call gives a strange result because the order was swapped.
If you leave out an argument, that parameter becomes undefined.
JavaScript does not raise an error for this.
Example
javascript
function greet(name, city) {
return "Hello " + name + " from " + city;
}
console.log(greet("Ada"));Here, city is undefined, so it appears in the text.
Extra arguments are simply ignored by the named parameters.
Example
javascript
function add(a, b) {
return a + b;
}
console.log(add(1, 2, 3, 4));Only 1 and 2 are used, so the answer is 3.
A parameter only exists inside its own function.
Changing it does not change the variable that was passed in.
Example
javascript
let score = 10;
function change(value) {
value = 99;
return value;
}
console.log(change(score));
console.log(score);The function returns 99, but the outside variable is still 10.
Numbers and strings are copied, but objects and arrays are shared.
Changing a property inside the function does change the original object.
Example
javascript
const user = { name: "Ada" };
function rename(person) {
person.name = "Grace";
}
rename(user);
console.log(user.name);The output is Grace, because both names point at the same object.
Complete Example
html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Function Parameters</title>
</head>
<body>
<h1>JavaScript Function Parameters</h1>
<p id="result"></p>
<script>
function describe(name, age) {
return name + " is " + age + " years old";
}
document.getElementById("result").innerHTML = describe("Ada", 36);
</script>
</body>
</html>Run the above example in the Try It Editor.
Try leaving out an argument:
Call describe("Ada") and see what happens to the age.
undefined.JavaScript function parameters let one function work with many different values.
Because arguments are matched by position, getting the order right is essential.
Understanding parameters helps you write functions that are easy to call correctly.