Functions in
Functions in are blocks of code designed to perform a specific task. They are executed when
called or invoked.
1. Function Declaration
A function can be declared using the function keyword, followed by the function name,
parentheses (which may include parameters), and a block of code enclosed in curly braces.
Syntax:
function functionName(parameters) {
// code to be executed
}
Example:
function greet(name) {
[Link]("Hello, " + name + "!");
}
greet("Alice"); // Output: Hello, Alice!
2. Function Expression
Functions can also be assigned to variables. These are called function expressions.
Syntax:
const variableName = function(parameters) {
// code to be executed
};
Example:
const greet = function(name) {
[Link]("Hi, " + name + "!");
};
greet("Bob"); // Output: Hi, Bob!
3. Arrow Functions
Introduced in ES6, arrow functions provide a concise syntax for writing functions.
Definition
An arrow function is a shorthand way of writing a function expression. It uses the => syntax
and does not have its own this, arguments, super, or [Link].
Syntax
(param1, param2, ..., paramN) => expression
If the function body has multiple lines or statements, use curly braces {} and an explicit
return statement if needed:
(param1, param2, ..., paramN) => {
// multiple statements
return result;
};
Features
1. Implicit Return:
If the function body contains only an expression, the result of that expression is
returned automatically without the need for the return keyword.
const add = (a, b) => a + b; // No return keyword required
[Link](add(3, 5)); // Output: 8
2. No this Binding:
Arrow functions do not have their own this context; they inherit it from the
enclosing scope.
const obj = {
value: 10,
increment: () => {
[Link]([Link]); // Undefined, as `this` is not bound
to `obj`
}
};
[Link](); // Output: undefined
Examples
1. Single Parameter
When there is a single parameter, parentheses are optional:
const square = x => x * x;
[Link](square(4)); // Output: 16
2. Multiple Parameters
Parentheses are required when there are multiple parameters:
const multiply = (a, b) => a * b;
[Link](multiply(3, 4)); // Output: 12
3. No Parameters
Use empty parentheses () when there are no parameters:
const greet = () => "Hello, World!";
[Link](greet()); // Output: Hello, World!
4. Using a Block Body
If the function body requires multiple lines, use curly braces:
const sumAndSquare = (a, b) => {
const sum = a + b;
return sum * sum;
};
[Link](sumAndSquare(2, 3)); // Output: 25
4. Anonymous Functions
Functions without a name are called anonymous functions. These are often used in function
expressions or as arguments to other functions.
Example1:
const greet = function(name) {
return `Hello, ${name}!`;
};
[Link](greet("Alice")); // Output: Hello, Alice!
Example2:
setTimeout(function() {
Conso [Link]("This runs after 2 seconds");
}, 2000);
5. Immediately Invoked Function Expressions (IIFE)
An IIFE is a function that runs as soon as it is defined.
Syntax:
(function() {
// code to be executed
})();
Example:
(function() {
[Link]("This is an IIFE");
})();
6. Parameters and Arguments
Parameters are variables listed in the function definition.
Arguments are the values passed to the function when it is invoked.
Example:
function multiply(a, b) {
return a * b;
}
[Link](multiply(2, 3)); // Output: 6
7. Default Parameters
Default parameters allow you to set default values for function parameters.
Example:
function greet(name = "Guest") {
[Link]("Hello, " + name + "!");
}
greet(); // Output: Hello, Guest!
greet("Charlie"); // Output: Hello, Charlie!
8. Rest Parameters
The ... syntax allows a function to accept an indefinite number of arguments as an array.
Example:
function sum(...numbers) {
return [Link]((total, num) => total + num, 0);
}
console. log(sum(1, 2, 3, 4)); // Output: 10
9. Return Statement
The return statement specifies the value a function should return.
Example:
function square(number) {
return number * number;
}
[Link](square(5)); // Output: 25
10. Higher-Order Functions
Functions that take other functions as arguments or return functions are called higher-order
functions.
Example:
function applyOperation(a, b, operation) {
return operation(a, b);
}
const add = (x, y) => x + y;
[Link](applyOperation(5, 3, add)); // Output: 8
11. Recursion
A function that calls itself is known as a recursive function.
Example:
function factorial(n) {
if (n === 0) {
return 1;
}
return n * factorial(n - 1);
}
[Link](factorial(5)); // Output: 120
12. Function Scope
Variables declared inside a function are local to that function and cannot be accessed from
outside.
Example:
function testScope() {
let localVar = "I am local";
[Link](localVar);
}
// [Link](localVar); // Error: localVar is not defined
By mastering functions, you can write reusable, modular, and efficient code for a variety of
applic ations.
13. Callback Functions
A callback is a function passed as an argument to another function.
Example:
function fetchData(callback) {
setTimeout(() => {
[Link]("Data fetched");
callback();
}, 1000);
}
fetchData(() => {
[Link]("Callback executed");
});
14. Closures
Closures in JavaScript
Definition
A closure is a combination of a function and its lexical environment within which it was
declared. It allows a function to access variables from its outer scope even after the outer
function has returned.
In simpler terms:
A closure gives you access to an outer function's variables from an inner function.
· Lexical Environment:
· A structure that holds identifier-variable mapping.
Created when code is run, defining where variables and functions are accessible.
· Lexical Scope:
Variables are accessible based on where they are declared in the source code, not where
they are called.
Example:
function outer() {
let outerVariable = "I'm outside!";
function inner() {
[Link](outerVariable); // Can access 'outerVariable' due to
lexical scope
inner();
outer();
// Output: I'm outside!
Example 2:
function outerFunction() {
let outerVariable = "I am from the outer scope";
function innerFunction() {
[Link](outerVariable); // Accessing the outerVariable
return innerFunction;
const closureFunction = outerFunction(); // The outer function is executed
closureFunction(); // Logs: I am from the outer scope