JavaScript Functions
1. Introduction to Functions
A function in JavaScript is a block of code that can be defined once and
executed multiple times. It helps in organizing code, making it reusable, and
improving readability.
Syntax:
function functionName(parameters) {
// code to be executed
}
• parameters: The values passed into the function (optional).
• functionName: The name of the function.
• Code block: The code inside the curly braces is executed when the
function is called.
Example:
function greet() {
[Link]("Hello, World!");
}
greet(); // Output: Hello, World!
2. Functions in JavaScript
In JavaScript, functions are first-class objects, meaning they can be assigned to
variables, passed as arguments, and returned from other functions.
Example:
// Function assigned to a variable
const sayHello = function() {
[Link]("Hello!");
};
sayHello(); // Output: Hello!
Returning a Value from a Function:
Functions can return values using the return keyword.
function add(a, b) {
return a + b;
}
let sum = add(2, 3); // sum = 5
[Link](sum); // Output: 5
3. Nested Functions in JavaScript
A nested function is a function defined within another function. The inner
function can access the outer function's variables and parameters.
Example:
function outer() {
const outerVar = "I'm outer!";
function inner() {
[Link](outerVar); // Accesses outerVar from the outer function
}
inner(); // Output: I'm outer!
}
outer();
4. Arrow Functions in JavaScript
Arrow functions are a shorthand syntax for writing functions in JavaScript. They
are introduced in ES6 and differ in terms of syntax and behavior, particularly in
handling the this keyword.
Syntax:
const functionName = (parameter1, parameter2) => {
// code to be executed
};
Example:
const greet = () => {
[Link]("Hello from Arrow Function!");
};
greet(); // Output: Hello from Arrow Function!
Arrow functions are particularly useful for writing concise code, especially
when working with anonymous functions.
Arrow Function with Parameters:
const add = (a, b) => a + b;
[Link](add(2, 3)); // Output: 5
5. Function as an Argument
Functions can be passed as arguments to other functions, enabling higher-
order functions, where a function accepts another function as an argument.
Example:
function greetUser(greetingFunction) {
greetingFunction(); // Call the passed-in function
}
function sayHello() {
[Link]("Hello, User!");
}
greetUser(sayHello); // Output: Hello, User!
Another example with arrow function:
function processUser(name, callback) {
[Link](`Processing user: ${name}`);
callback(name);
}
processUser("Alice", name => {
[Link](`Hello, ${name}!`);
});
6. Function as the Returned Object
Functions in JavaScript can also be returned from other functions. This allows
for more flexible and dynamic behaviour.
Example:
function multiplier(factor) {
return function(number) {
return number * factor;
};
}
const multiplyByTwo = multiplier(2);
[Link](multiplyByTwo(5)); // Output: 10
const multiplyByThree = multiplier(3);
[Link](multiplyByThree(5)); // Output: 15
In this example, the function multiplier returns another function that multiplies
its argument by a specific factor.
Key Points to Remember:
• Functions as first-class citizens: Functions can be assigned to variables,
passed as arguments, and returned from other functions.
• Anonymous Functions: Functions without a name, typically passed
directly as arguments or assigned to variables.
• Arrow Functions: Shorter function syntax, and they don't have their own
this (they inherit this from the surrounding context).
• Nested Functions: Functions defined inside other functions; inner
functions have access to the outer function's scope.
