Learn JavaScript
from Zero to Expert

Introduction to Arrow Functions

Arrow functions are a modern (ES6) syntax for writing shorter, cleaner functions. They’re very popular in modern JavaScript.

Classic syntax vs Arrow function:

• function add(a, b) { return a + b; } - traditional function
• const add = (a, b) => a + b; - arrow function
• If you have a single parameter, you can omit parentheses: x => x * 2
• For a single statement, the return is implicit

// Traditional function
function greet(name) {
    return "Hello, " + name + "!";
}

// Arrow function - short version
const greetArrow = (name) => `Hello, ${name}!`;

// Arrow function with multiple lines
const calculate = (a, b) => {
    const sum = a + b;
    const product = a * b;
    return { sum, product };
};

// Using array methods
const numbers = [1, 2, 3, 4, 5];
const doubles = numbers.map(n => n * 2);
console.log(doubles); // [2, 4, 6, 8, 10]