V čem se šipkové funkce liší od běžných funkcí z…

Šipkové funkce nem mají vlastní kontext this. Zachytávají this z okolního prostředí (lexikálního prostředí).

Obvyklé funkce definují svůj this v závislosti na způsobu volání:

V globálním kontextu (window nebo global).
Jako metoda objektu (this odkazuje na objekt).
Jako konstruktor (this odkazuje na novou instanci).
Pomocí call, apply nebo bind (this je nastaveno explicitně).

Protože šipkové funkce nemají vlastní this, volání bind na šipkové funkci nedává smysl a nezmění lexikálně vázaný this. Pokud se pokusíte volat bind na šipkové funkci, jednoduše se vrátí sama.

Příklad:

// Normální funkce
const normalFunc = function() {
  console.log(this.name);
};

const obj1 = { jméno: 'Objekt 1', metoda: normalFunc };
const obj2 = { jméno: 'Objekt 2' };

obj1.metoda(); // Výstup: Objekt 1

const boundFunc = normalFunc.bind(obj2);
boundFunc(); // Výstup: Objekt 2 (this byl úspěšně změněn)

// Šipková funkce
const arrowFunc = () => {
  console.log(this.name);
};

const obj3 = { jméno: 'Objekt 3' };

// ArrowFunc zachytává `this` z okolního prostředí (v tomto případě globální objekt)
arrowFunc(); // Výstup: undefined (pravděpodobně, protože `this` neobsahuje `name`)

const boundArrowFunc = arrowFunc.bind(obj3);
boundArrowFunc(); // Výstup: undefined (`this` nezměněno, bind neměl efekt)

// Příklad s zachycením `this`
const person = {
  jméno: 'Alice',
  greet: function() {
    // Tady `this` odkazuje na `person`
    const greetLater = () => {
      // Tady `this` je zachyceno z vnějšího kontextu `greet`, tedy také na `person`
      console.log(`Ahoj, ${this.jméno}!`);
    };
    greetLater();
  }
};

person.greet(); // Výstup: Ahoj, Alice!

Shrnutí: metoda bind je nutná pro normální funkce, aby explicitně nastavila jejich kontext this, zatímco u šipkových funkcí je nadbytečná, protože jejich this je určeno lexikálně a nelze jej změnit pomocí bind.

V čem se šipkové funkce liší od běžných funkcí z hlediska nutnosti použití metody bind?