Different Types of JavaSript Functions
gaurbprajapati
Posted on June 5, 2023
1. Function Declarations:
function add(a, b) {
return a + b;
}
Function declarations define a named function with the function
keyword, followed by the function name and a set of parentheses for parameters. They are hoisted to the top of their scope, meaning they can be called before they are defined in the code.
2. Function Expressions:
const multiply = function(a, b) {
return a * b;
};
Function expressions involve assigning a function to a variable. They are created using the function
keyword, followed by optional function name (anonymous if omitted), and a set of parentheses for parameters. Function expressions are not hoisted and can only be called after they are defined.
3. Arrow Functions:
const square = (x) => {
return x * x;
};
Arrow functions provide a concise syntax for writing functions. They use the arrow (=>
) operator and automatically bind this
to the surrounding context. They are commonly used for anonymous functions and have an implicit return if the body is a single expression.
4. Immediately Invoked Function Expressions (IIFE):
(function() {
// Code executed immediately
})();
IIFEs are self-invoking functions that are executed immediately after they are defined. They are enclosed within parentheses to ensure the function is treated as an expression. IIFEs are commonly used to create a new scope, encapsulate code, and avoid polluting the global namespace.
5. Methods:
const obj = {
name: 'John',
greet: function() {
console.log(`Hello, ${this.name}!`);
}
};
obj.greet(); // Output: Hello, John!
Methods are functions that are defined as properties of objects. They can be called using the object reference followed by the dot notation. Methods have access to the object's properties and can use the this
keyword to refer to the object.
6. Callback Functions:
```
function doSomething(callback) {
// Perform some tasks
// Invoke the callback function
callback();
}
function callbackFunction() {
console.log("Callback function executed!");
}
// Pass callbackFunction as a callback to doSomething
doSomething(callbackFunction);
```
Callback functions are functions passed as arguments to other functions. They are invoked by the receiving function at a specific time or when a certain event occurs. Callback functions are commonly used for handling asynchronous operations, event handling, and functional programming patterns.
7. Anonymous Function with Function Expression:
const greet = function(name) {
console.log(`Hello, ${name}!`);
};
greet('John'); // Output: Hello, John!
In this example, the greet
variable is assigned an anonymous function using a function expression. The function takes a name
parameter and logs a greeting to the console. It can be called using the greet
variable.
8. Anonymous Function as a Callback:
function calculate(a, b, operation) {
const result = operation(a, b);
console.log(`Result: ${result}`);
}
calculate(5, 3, function(x, y) {
return x * y;
}); // Output: Result: 15
Here, the calculate
function takes three arguments: a
, b
, and operation
, where operation
is a callback function. The callback function is defined anonymously as a parameter to the calculate
function and multiplies a
and b
. It is invoked within the calculate
function to perform a specific operation.
These are some of the common types of functions in JavaScript. Understanding their differences and use cases can help you write clean, modular, and maintainable code.
Posted on June 5, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
October 20, 2024