REFERENCEjavascript

javascript Documentation

📖 INDEX

# what-is-javascript

# function-declaration

# function-expressions

# anonymous-functions

# arrow-functions

# return

# recursive-functions

# arguments-parameters

# array-destructuring

# what-is-dom

# element-selection

# selection-methods

# elements-manipulation

# events

# event-listeners

# modification-methods

LOADING ENGINE...

Arguments & Parameters

AI & DATA SCIENCE // arguments-parameters

Parameters are variable names in a function definition. Arguments are the actual values passed when calling the function.

Syntax

function greet(name, greeting = 'Hello') { // params
  return `${greeting}, ${name}!`;
}
greet('Alice', 'Hi'); // arguments

Deep Dive Course

**Parameters** are placeholders in the function signature. **Arguments** are the values provided at call time. ES6 added **default parameters**, **rest parameters** (`...args`), and the static **arguments** object (not available in arrow functions). Extra arguments are ignored; missing arguments become undefined.

1Understanding Arguments & Parameters

Parameters are placeholders in the function signature. Arguments are the values provided at call time. ES6 added default parameters, rest parameters (...args), and the static arguments object (not available in arrow functions). Extra arguments are ignored; missing arguments become undefined.

💡

Use rest parameters (...args) instead of the legacy 'arguments' object for better readability and arrow function compatibility.

editor.html

// Default + rest parameters
function sum(initial = 0, ...numbers) {
  return numbers.reduce((acc, n) => acc + n, initial);
}
console.log(sum());          // 0
console.log(sum(10, 1,2,3)); // 16

localhost:3000

2Practical Example

Here is a real-world application of Arguments & Parameters showing how it is used in production JavaScript code.

editor.html

// Destructured object parameters
function createUser({ name, age, role = 'user' }) {
  return { name, age, role, id: Math.random() };
}
const user = createUser({ name: 'Alice', age: 30 });
console.log(user.name, user.role);

localhost:3000

3Best Practices

Follow these guidelines when working with Arguments & Parameters:

1. Use default parameters for optional arguments

2. Use rest parameters to accept variable argument counts

3. Destructure object arguments for named parameters

⚠️

Tip: Use rest parameters (...args) instead of the legacy 'arguments' object for better readability and arrow function compatibility.

editor.html

// Default + rest parameters
function sum(initial = 0, ...numbers) {
  return numbers.reduce((acc, n) => acc + n, initial);
}
console.log(sum());          // 0
console.log(sum(10, 1,2,3)); // 16

localhost:3000

Examples

Example 01Basic Usage

// Default + rest parameters
function sum(initial = 0, ...numbers) {
  return numbers.reduce((acc, n) => acc + n, initial);
}
console.log(sum());          // 0
console.log(sum(10, 1,2,3)); // 16

Example 02Advanced Example

// Destructured object parameters
function createUser({ name, age, role = 'user' }) {
  return { name, age, role, id: Math.random() };
}
const user = createUser({ name: 'Alice', age: 30 });
console.log(user.name, user.role);

Best Practices

Use default parameters for optional arguments
Use rest parameters to accept variable argument counts
Destructure object arguments for named parameters

Interview Question

What is the difference between rest parameters and the arguments object?▼

Hint: Array vs array-like, arrow functions.

The 'arguments' object is an array-LIKE object (no array methods) available in regular functions. Rest parameters (...args) create a real Array and work in arrow functions too. Always prefer rest parameters in modern code.

Exercises

MediumPractice using Arguments & Parameters in a real scenario.

View Solution

// Default + rest parameters
function sum(initial = 0, ...numbers) {
  return numbers.reduce((acc, n) => acc + n, initial);
}
console.log(sum());          // 0
console.log(sum(10, 1,2,3)); // 16

Frequently Asked Questions

What is the difference between rest parameters and the arguments object?▼

Related Functions

Function-DeclarationArrow-FunctionsDestructuring