Pričaj o kontekstu funkcija u JavaScriptu.

Контекст izvršavanja funkcije (this) u JavaScript-u određuje kako se funkcija poziva i koje vrednosti su dostupne unutar nje. Kontekst se dinamički menja u zavisnosti od načina poziva:

• Globalni kontekst: Izvan funkcija, this se odnosi na globalni objekat (window u pretraživaču, global u Node.js-u).

  // U pretraživaču
  console.log(this === window); // true
  
  // U Node.js-u
  console.log(this === global); // true
  

• Kontekst funkcije:
  • Standardni poziv: U ne-strikt režimu this se odnosi na globalni objekat (ako funkcija nije metoda objekta). U strict režimu ("use strict";) this će biti undefined.

    function showThis() {
      console.log(this);
    }
    
    showThis(); // U ne-strikt režimu: Globalni objekat; U strict režimu: undefined
    

  • Poziv kao metoda objekta:
    • this se odnosi na objekat kojem metoda pripada.

    const user = {
      name: 'Alice',
      greet: function() {
        console.log("Hello, my name is " + this.name);
      }
    };
    
    user.greet(); // Hello, my name is Alice
    

  • Poziv sa new (konstruktor):
    • Kreira novi objekat, koji postaje vrednost this unutar konstruktor funkcije, i vraća taj objekat.

    function Person(name) {
      this.name = name;
    }
    
    const person1 = new Person('Bob');
    console.log(person1.name); // Bob
    

  • Jasno navođenje konteksta (call, apply, bind):
    • call(thisArg, arg1, arg2, ...): Poziva funkciju sa datim this i argumentima navedenim posebno.
    • apply(thisArg, [argsArray]): Poziva funkciju sa datim this i argumentima u nizu.
    • bind(thisArg, arg1, arg2, ...): Vraća novu funkciju, čiji je this zauvek povezan sa thisArg i argumentima.

    function introduce(greeting, punctuation) {
      console.log(greeting + ", I am " + this.name + punctuation);
    }
    
    const person = { name: 'Charlie' };
    
    introduce.call(person, "Hi", "!");  // Hi, I am Charlie!
    introduce.apply(person, ["Hello", "."]); // Hello, I am Charlie.
    
    const boundIntroduce = introduce.bind(person, "Hey");
    boundIntroduce("?"); // Hey, I am Charlie?
    

• Funkcije strelice: Nemaju sopstveni this. Uhvataju this iz okoline u kojoj su definisane.

  const obj = {
    name: 'David',
    sayLater: function() {
      // `this` ovde se odnosi na `obj`
      setTimeout(() => {
        // `this` ovde takođe se odnosi na `obj` (nasleđeno iz `sayLater`)
        console.log("Later, I am " + this.name);
      }, 1000);
    }
  };
  
  obj.sayLater(); // Later, I am David