How to Use Parameters in JavaScript

Use parameters when a function should work with different input values instead of hardcoded data. Parameters make one function reusable for many scenarios like calculations, formatting, validation, and API helpers.

What you’ll build or solve

You’ll learn how to use parameters in JavaScript functions. You’ll also know how to pass multiple values, use default parameters, and avoid undefined inputs.

When this approach works best

This approach is the right choice when the same function logic should work with different values.

Common real-world scenarios include:

• Price calculations
• Greeting users
• Input validation
• API request helpers
• Data formatting

This is a bad idea when the function always uses the same fixed value and no variation is needed.

Prerequisites

You only need:

• A JavaScript file or browser console
• Basic function knowledge

Step-by-step instructions

Step 1: Add parameters inside the function parentheses

Place parameter names inside the function definition.

function greetUser(name) {
  return `Hello, ${name}`;
}

console.log(greetUser("Alex"));

Use multiple parameters when the function needs more than one input.

function add(a, b) {
  return a + b;
}

console.log(add(4, 6));

Default parameters help prevent missing values.

function greetUser(name = "Guest") {
  return `Hello, ${name}`;
}

What to look for:

• Parameters go inside function parentheses
• Values passed during the call become arguments
• Multiple parameters are comma-separated
• Defaults prevent undefined
• Use clear names based on meaning

Examples you can copy

Tax calculator

function addTax(price, rate) {
  return price * rate;
}

Personalized greeting

function welcome(name) {
  return `Welcome, ${name}`;
}

Default quantity

function addToCart(item, quantity = 1) {
  return `${item} x${quantity}`;
}

Common mistakes and how to fix them

Mistake 1: Forgetting to pass required arguments

What the reader might do:

function greet(name) {
  return `Hi, ${name}`;
}

greet();

Why it breaks: name becomes undefined.

Corrected approach:

function greet(name = "Guest") {
  return `Hi, ${name}`;
}

Mistake 2: Using unclear parameter names

What the reader might do:

function total(x, y) {
  return x + y;
}

Why it breaks: the meaning becomes harder to understand later.

Corrected approach:

function total(price, tax) {
  return price + tax;
}

Mistake 3: Mixing parameter order

What the reader might do:

function createUser(role, name) {
  return `${name} is ${role}`;
}

createUser("Alex", "admin");

Why it breaks: the values end up in the wrong positions.

Corrected approach:

createUser("admin", "Alex");

Or reorder the parameter list.

Troubleshooting

If a value becomes undefined, confirm the function call passes the argument.

If defaults do not work, check the default assignment syntax.

If results look swapped, verify parameter order.

If function names are clear but parameters are vague, rename them based on meaning.

Quick recap

• Add parameters inside function parentheses
• Pass arguments during the call
• Use commas for multiple parameters
• Use defaults for safer calls
• Name parameters by meaning