Kas ir konteksts JavaScript?

Konteksts (this) JavaScript ir irsa atsauce uz objektu, kurā tiek izpildīta pašreizējā funkcija. Tā vērtība tiek noteikta pēc tā, kā funkcija tika izsaukta, nevis pēc tā, kur tā tika definēta.

Galvenie veidi, kā noteikt kontekstu:

• Globālais konteksts: ārpus funkcijām, nelimita režīmā this atsaucas uz globālo objektu (window pārlūkprogrammā, global Node.js). Stingrā režīmā this ir undefined.

  // Nelimita režīms (pārlūkprogrammā)
  console.log(this === window); // true
  
  // Stingrā režīms
  "use strict";
  console.log(this === undefined); // true
  

• Objekta metode: Ja funkcija tiek izsaukta kā objekta metode (obj.method()), this funkcijas iekšienē atsaucas uz šo objektu (obj).

  const user = {
      name: "John",
      greet: function() {
          console.log("Hello, " + this.name);
      }
  };
  user.greet(); // Izvade: Hello, John (this atsaucas uz `user`)
  

• Funkcijas izsaukšana (call, apply, bind): Metodes call un apply izsauc funkciju ar tieši norādītu kontekstu. bind izveido jaunu funkciju ar fiksētu kontekstu.

  function sayName(greeting) {
      console.log(greeting + ", " + this.name);
  }
  
  const person = { name: "Peter" };
  
  sayName.call(person, "Hi"); // Izvade: Hi, Peter (this = `person`)
  sayName.apply(person, ["Hello"]); // Izvade: Hello, Peter (this = `person`)
  
  const boundSayName = sayName.bind(person, "Hey");
  boundSayName(); // Izvade: Hey, Peter (this = `person`)
  

• Konstruktors (new): Kad funkcija tiek izsaukta ar operatoru new, tiek izveidots jauns tukšs objekts, un this funkcijas konstruktora iekšienē atsaucas uz šo jauno objektu.

  function Person(name) {
      this.name = name;
  }
  
  const john = new Person("John");
  console.log(john.name); // Izvade: John (this iekš `Person` atsaucas uz `john`)
  

• Līnijas funkcijas: Līnijas funkcijām nav sava konteksta. this iekšā tiek ņemts no ārējās (leksiskās) vides, kur funkcija tika izveidota.

  const user = {
      name: "Alice",
      greet: function() {
          const innerGreet = () => {
              console.log("Hello, " + this.name); // `this` ņemts no `greet` (atsaucas uz `user`)
          };
          innerGreet();
      }
  };
  user.greet(); // Izvade: Hello, Alice
  

Saprotot, kā tiek noteikts this, ir ļoti svarīgi, lai pareizi strādātu ar objektiem, metodēm un notikumu apstrādātājiem JavaScript.