Functions in JavaScript
Functions are blocks of code designed to perform specific tasks. They allow
developers to reuse code, making programs more modular and efficient.
1. Defining Functions
Function Declaration
A named function that can be called before it is defined due to hoisting.
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet("Alice")); // Output: Hello, Alice!
Function Expression
A function assigned to a variable. Unlike declarations, these are not hoisted.
const greet = function(name) {
return `Hello, ${name}!`;
};
console.log(greet("Bob")); // Output: Hello, Bob!
Arrow Function
A shorter syntax introduced in ES6.
const greet = (name) => `Hello, ${name}!`;
console.log(greet("Charlie")); // Output: Hello, Charlie!
2. Parameters and Arguments
Default Parameters
Provide default values for parameters if not supplied by the caller.
, function greet(name = "Guest") {
return `Hello, ${name}!`;
}
console.log(greet()); // Output: Hello, Guest!
Rest Parameters
Allow functions to accept an indefinite number of arguments as an array.
function sum(...numbers) {
return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10
Spread Syntax
Spread elements of an array or object as arguments to a function.
const numbers = [1, 2, 3];
console.log(Math.max(...numbers)); // Output: 3
3. Function Scope and Closures
Scope
Functions in JavaScript have access to variables in their own scope, parent scope,
and global scope.
let globalVar = "I am global";
function example() {
let localVar = "I am local";
console.log(globalVar); // Access globalVar
}
example();
// console.log(localVar); // Error: localVar is not defined
Closures
Functions are blocks of code designed to perform specific tasks. They allow
developers to reuse code, making programs more modular and efficient.
1. Defining Functions
Function Declaration
A named function that can be called before it is defined due to hoisting.
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet("Alice")); // Output: Hello, Alice!
Function Expression
A function assigned to a variable. Unlike declarations, these are not hoisted.
const greet = function(name) {
return `Hello, ${name}!`;
};
console.log(greet("Bob")); // Output: Hello, Bob!
Arrow Function
A shorter syntax introduced in ES6.
const greet = (name) => `Hello, ${name}!`;
console.log(greet("Charlie")); // Output: Hello, Charlie!
2. Parameters and Arguments
Default Parameters
Provide default values for parameters if not supplied by the caller.
, function greet(name = "Guest") {
return `Hello, ${name}!`;
}
console.log(greet()); // Output: Hello, Guest!
Rest Parameters
Allow functions to accept an indefinite number of arguments as an array.
function sum(...numbers) {
return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10
Spread Syntax
Spread elements of an array or object as arguments to a function.
const numbers = [1, 2, 3];
console.log(Math.max(...numbers)); // Output: 3
3. Function Scope and Closures
Scope
Functions in JavaScript have access to variables in their own scope, parent scope,
and global scope.
let globalVar = "I am global";
function example() {
let localVar = "I am local";
console.log(globalVar); // Access globalVar
}
example();
// console.log(localVar); // Error: localVar is not defined
Closures
