Arrow Functions in JavaScript (ES6+)

Arrow functions were introduced in ES6 (ECMAScript 2015) to provide a shorter and cleaner syntax for writing functions in JavaScript. They are especially popular in modern JavaScript frameworks like React, Node.js, and Vue due to their concise syntax and predictable behavior.

What is an Arrow Function?

An arrow function is a compact alternative to a traditional function expression. It helps reduce boilerplate code and improves readability, especially for small functions and callbacks.

Basic Syntax:

() => {}

Example:Simple Addition

const add = (a, b) => a + b;

✔️ When the function body contains only one expression, you can:

• Omit the return keyword
• Omit the curly braces {}

Multiple Statements (Block Body)

For multiple lines of code, parentheses and curly braces are required, and you must explicitly use return if a value is returned.

const calculateSum = (a, b) => {
  const result = a + b;
  return result;
};

Key Characteristics of Arrow Functions

1. No this Binding
2. Cannot Be Used as Constructors
3. Best for Single-Line Functions

Normal Function vs Arrow Function

Need to Remember for Arrow function

1. For simpler and single line function
2. Can’t able to access this keyword
3. Can’t able to use for constructor