Module 19 // Core JavaScript

Arrow Functions

Module Objective

Lexical this, syntax differences, limitations, use cases

Mental Model Realtime Simulation

INTERACTIVE_CANVAS

Editor_Pane

Console_Output

Waiting for output...

Practical Code Examples

// Example 1

// 1. Preservation of 'this'
const timer = {
  seconds: 0,
  start() {
    // Arrow function captures 'this' from start()
    setInterval(() => {
      this.seconds++;
      console.log(this.seconds);
    }, 1000);
  }
};

// timer.start();

💡 In a regular function, `this` would be the global `window` object inside `setInterval`. The arrow function captures `this` from the `start` method, so it correctly refers to the `timer` object.

// Example 2

// 2. No 'arguments' object
const logArgs = (...args) => {
  // console.log(arguments); // ❌ ReferenceError
  console.log(args);        // ✅ Works!
};

logArgs(1, 2, 3);

💡 Arrow functions don't have an `arguments` object. You must use **Rest Parameters** (`...args`) to access passed values dynamically.

// Example 3

// 3. Not a Constructor
const Person = (name) => {
  this.name = name;
};

// const subhajit = new Person("Subhajit"); // ❌ TypeError: Person is not a constructor

💡 Arrow functions cannot be used with the `new` keyword and do not have a `prototype` property. They are designed for logic, not for building class instances.

Engine & Memory Architecture

The Arrow Advantage

1. Context Capture:

During the Creation Phase, the engine does not allocate a this pointer for the arrow function's context.
It links directly to the Lexical Scope's context. This saves a small amount of memory per call.

2. Prototype-Free:

Regular functions have a prototype property (a whole object in the Heap).
Arrow functions do not. This makes them "lighter" objects in memory.

3. JIT Inlining:

Because arrow functions are concise and have predictable context, the JIT Compiler can often "inline" them (replace the function call with the actual code) more easily than regular functions, leading to better CPU performance.

PREVIOUS_MODULEArguments Object & Rest Parameters NEXT_MODULE Prototype Chain