Jak změnit kontext funkce v JavaScriptu?

V JavaScriptu lze kontext vykonávání funkce (this) změnit několika způsoby:

1. call(): Spustí funkci s určenou hodnotou this a argumenty předané jednotlivě oddělené čárkami.

   // function.call(thisArg, arg1, arg2, ...)
   function greet(name) {
     console.log(`Ahoj, ${name}! Jsem ${this.type}`);
   }
   
   const obj = { type: 'objekt' };
   
   greet.call(obj, 'Alice'); // Ahoj, Alice! Jsem objekt
   

2. apply(): Spustí funkci s určenou hodnotou this a argumenty předané jako pole nebo pole podobný objekt.

   // function.apply(thisArg, [argsArray])
   function sum(a, b) {
     console.log(`${this.name}: ${a + b}`);
   }
   
   const context = { name: 'Kalkulačka' };
   const numbers = [5, 10];
   
   sum.apply(context, numbers); // Kalkulačka: 15
   

3. bind(): Vytvoří novou funkci "vázanou" k určené hodnotě this. Původní funkce se nevykoná ihned.

   // function.bind(thisArg, arg1, arg2, ...)
   const user = { name: 'Bob' };
   
   function sayHello() {
     console.log(`Mé jméno je ${this.name}`);
   }
   
   const boundSayHello = sayHello.bind(user);
   
   boundSayHello(); // Mé jméno je Bob
   

4. Šipkové funkce (=>): Šipkové funkce nemají vlastní kontext this. Zachytávají this z lexikálního prostředí (z okolního scope, kde byly definovány).

   class MyClass {
     constructor() {
       this.value = 'hodnota třídy';
       // Šipková funkce zachovává kontext třídy
       this.logValue = () => {
         console.log(this.value);
       };
     }
   }
   
   const instance = new MyClass();
   const method = instance.logValue;
   
   method(); // hodnota třídy (kontekst je zachován)
   
   // Porovnejte s normální funkcí bez bind
   class JinaTřída {
       constructor() {
           this.value = 'jiná hodnota';
           this.logValue = function() {
               console.log(this.value); // 'this' bude window nebo undefined v režimu striktním
           };
       }
   }
   
   const jinaInstance = new JinaTřída();
   const jinaMetoda = jinaInstance.logValue;
   
   jinaMetoda(); // undefined (kontekst je ztracen při volání jako samostatná funkce)