Ի՞նչ է կոնտեքստը JavaScript-ում։

Կոնտեքստը (this) JavaScript-ում՝ դա հղում է օբյեկտին, որի շրջանակներում կատարվում է ընթացիկ ֆունկցիան։ Նրա արժեքը որոշվում է այն կերպով, ինչպես է ֆունկցիան կանչվել, ոչ թե այն վայրով, որտեղ այն սահմանվել է։

Հիմնական եղանակները կոնտեքստը որոշելու համար՝

• Գլոբալ կոնտեքստ: Ֆունկցիաների դուրս, ոչ խիստ ռեժիմում this հղում է գլոբալ օբյեկտին (window բրաուզերում, global Node.js-ում): Խիստ ռեժիմում this հավասար է undefined:

  // Ներքին ռեժիմ (բրաուզերում)
  console.log(this === window); // true
  
  // Խիստ ռեժիմ
  "use strict";
  console.log(this === undefined); // true
  

• Օբյեկտի մեթոդ: Եթե ֆունկցիան կանչվում է որպես օբյեկտի մեթոդ (obj.method()), ապա this-ը ֆունկցիայի ներսում հղում է այդ օբյեկտին (obj):

  const user = {
      name: "John",
      greet: function() {
          console.log("Hello, " + this.name);
      }
  };
  user.greet(); // Արտածում՝ Hello, John (this հղում է `user`-ին)
  

• Ֆունկցիայի կանչ (call, apply, bind): call և apply մեթոդները ֆունկցիան կանչում են հստակ կոնտեքստով։ bind-ը ստեղծում է նոր ֆունկցիա՝ հաստատված կոնտեքստով։

  function sayName(greeting) {
      console.log(greeting + ", " + this.name);
  }
  
  const person = { name: "Peter" };
  
  sayName.call(person, "Hi"); // Արտածում՝ Hi, Peter (this = person)
  sayName.apply(person, ["Hello"]); // Արտածում՝ Hello, Peter (this = person)
  
  const boundSayName = sayName.bind(person, "Hey");
  boundSayName(); // Արտածում՝ Hey, Peter (this = person)
  

• Կոնստրուկտոր (new): Երբ ֆունկցիան կանչվում է new օպերատորով, ստեղծվում է նոր դատարկ օբյեկտ, և this-ը ֆունկցիայի ներսում հղում է այդ նոր օբյեկտին:

  function Person(name) {
      this.name = name;
  }
  
  const john = new Person("John");
  console.log(john.name); // Արտածում՝ John (this-ը `Person`-ի ներսում հղում է `john`-ին)
  

• Աղեղային ֆունկցիաներ: Աղեղային ֆունկցիաների սեփական կոնտեքստ չկա։ this-ը ներսում վերցվում է արտաքին (լեքսիկական) տեսադաշտից, որտեղ ֆունկցիան ստեղծվել է:

  const user = {
      name: "Alice",
      greet: function() {
          const innerGreet = () => {
              console.log("Hello, " + this.name); // this-ը վերցվում է `greet`-ից (հղում է `user`-ին)
          };
          innerGreet();
      }
  };
  user.greet(); // Արտածում՝ Hello, Alice
  

Հասկանալը, թե ինչպես է որոշվում this, կարևոր է ճիշտ աշխատելու համար օբյեկտների, մեթոդների և իրադարձությունների handler-ների հետ JavaScript-ում։