Räägi JavaScripti funktsioonide kontekstist.

JavaScriptis määrab funktsiooni täitmise konteksti (this), kuidas funktsioon kutsutakse ja millised väärtused on selle sees saadaval. Kontekst muutub dünaamiliselt sõltuvalt kutsumise viisist:

• Globaalne kontekst: Funktsioonide väliselt viitab this globaalsele objektile (window brauseris, global Node.js-is).

  // Brauseris
  console.log(this === window); // true
  
  // Node.js-is
  console.log(this === global); // true
  

• Funktsiooni kontekst:
  • Tavaline kutsumine: Mitte-strict režiimis viitab this globaalsele objektile (kui funktsioon ei ole objekti meetod). Strict režiimis ("use strict";) on this undefined.

    function showThis() {
      console.log(this);
    }
    
    showThis(); // Mitte-strict režiimis: Globaalne objekt; Strict režiimis: `undefined`
    

  • Kutsumine objekti meetodina:
    • this viitab objekti, millele meetod kuulub, kontekstile:

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

  • Kutsumine new-ga (konstruktor):
    • Loob uue objekti, mis muutub this-ks konstruktorifunktsioonis ja tagastab selle objekti:

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

  • Selge konteksti määramine (call, apply, bind):
    • call(thisArg, arg1, arg2, ...): Kutsub funktsiooni määratud this-ga ja argumentidega.
    • apply(thisArg, [argsArray]): Kutsub funktsiooni määratud this-ga ja argumentide massiiviga.
    • bind(thisArg, arg1, arg2, ...): Tagastab uue funktsiooni, mille this on igavesti seotud thisArg-ga ja argumentidega.

    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?
    

• Arrow funktsioonid: Neil ei ole oma this. Nad haaravad this ümbritsevast leksikaalsest kontekstist:

  const obj = {
    name: 'David',
    sayLater: function() {
      // `this` viitab `obj`
      setTimeout(() => {
        // `this` viitab samuti `obj` (pärandatud `sayLater`-ist)
        console.log("Later, I am " + this.name);
      }, 1000);
    }
  };
  
  obj.sayLater(); // Later, I am David