Functions Advanced
Arrow Functions
() => {} Syntax
💡 Arrow function ek shorthand nickname jaisa hai — poora "function keyword, curly braces" formal naam bolne ke bajaye, ek chhota, concise version. Same kaam, kam typing.
Arrow functions (ES6+) function likhne ka concise syntax hai — (params) => expression. Single expression ho to curly braces aur return dono skip kar sakte ho ("implicit return"). Sabse BADA functional farq: arrow functions apna khud ka this NAHI rakhte — surrounding scope ka this "inherit" karte hain (Advanced JavaScript category mein detail se).
// Traditional function:
function add(a, b) {
return a + b;
}
// Arrow function — same kaam:
const add2 = (a, b) => {
return a + b;
};
// Concise arrow (implicit return, single expression):
const add3 = (a, b) => a + b;
// Single parameter — parentheses optional:
const square = x => x * x;
// No parameters:
const greet = () => "Hello!";➡️
Arrow function ek shorthand nickname jaisa hai — poora "function keyword, curly braces" formal naam bolne ke bajaye, ek chhota, concise version. Same kaam, kam typing.
1 / 6
⚡ झट से Recap
- (params) => expression = concise syntax, implicit return
- Apna khud ka this nahi rakhte — surrounding scope se inherit
- Array methods (map/filter) ke saath bahut common
इस page में (2 subtopics)
Arrow functions new keyword ke saath use nahi ho sakte (jaise new ArrowFn() error dega) — regular functions constructors ki tarah use ho sakte hain, arrow functions genuinely sirf "functions" hain, is purpose ke liye nahi bane.
function RegularFn(name) {
this.name = name;
}
const obj = new RegularFn("test"); // valid
const ArrowFn = (name) => {
this.name = name;
};
// const obj2 = new ArrowFn("test"); // ERROR: ArrowFn is not a constructorTip: Arrow functions ka "no this binding" nature hi wajah hai ki ye constructors nahi ban sakte — constructors ko apna khud ka this chahiye hota hai naye object ke liye.
Arrow function se seedha ek object literal return karna ho, extra parentheses zaroori hain — warna { } ko function BODY samjha jaayega, object literal nahi.
// GALAT — { } function body samjha jaata hai:
// const makeUser = (name) => { name: name }; // undefined return karta hai!
// SAHI — parentheses se object literal clear hota hai:
const makeUser = (name) => ({ name: name });
console.log(makeUser("Aarav")); // { name: "Aarav" }Common Mistake: Ye ek bahut common, confusing bug hai beginners ke liye — arrow function se object return karte waqt, hamesha ({ ... }) parentheses use karo, warna curly braces function body ban jaate hain.