Funksiyada kontekst nədir?

JavaScript-də (this) kontekst funksiyanın necə çağırıldığına görə müəyyən edilir, onun elan olunduğu yerə deyil. O, funksiyaya aid olan obyektə və ya onu çağıran obyektə işarə edir.

Konteksti müəyyən etməyin yolları:

1. Qlobal kontekst: Funksiyalar xaricində və ya funksiyanı açıq obyekt olmadan çağırdıqda (this brauzerdə window, Node.js-də global, və ya strict rejimdə undefined olur).

   // Brauzerdə
   console.log(this === window); // true
   
   function showContext() {
     console.log(this);
   }
   
   showContext(); // window
   

2. Obyekt konteksti (metod): Əgər funksiya obyektin metodu kimi çağırılırsa (obj.method()), this funksiyanın içində həmin obyektə istinad edir.

   const user = {
     name: 'Alice',
     greet: function() {
       console.log(`Salam, mənim adım ${this.name}`);
     }
   };
   
   user.greet(); // Salam, mənim adım Alice
   

3. Konstruktor konteksti: new açar sözü ilə çağırıldıqda (new MyClass()), yeni obyekt yaradılır və konstruktor içində this həmin yeni obyektə istinad edir.

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

4. Açıq kontekst göstərişi: call, apply və bind metodları ilə this-in dəyərini açıq şəkildə təyin etmək mümkündür.

   • call(thisArg, arg1, arg2, ...): Funksiyanı this thisArg ilə və argumentlərlə çağırır.
   • apply(thisArg, [argsArray]): Funksiyanı this thisArg ilə və argumentləri massiv kimi verərək çağırır.
   • bind(thisArg, arg1, arg2, ...): this-i müəyyənləşdirilmiş yeni funksiya qaytarır.

   function displayInfo(age) {
     console.log(`${this.name} ${age} yaşında.`);
   }
   
   const person = { name: 'Charlie' };
   
   displayInfo.call(person, 30); // Charlie 30 yaşında.
   displayInfo.apply(person, [35]); // Charlie 35 yaşında.
   
   const bondedDisplayInfo = displayInfo.bind(person, 40);
   bondedDisplayInfo(); // Charlie 40 yaşında.
   

5. Ox funksiyalar: Ox funksiyalarının öz this-i yoxdur. Onlar this-i leksikal mühitdən miras alır.

   const anotherUser = {
     name: 'David',
     sayHello: function() {
       const innerArrow = () => {
         console.log(`Salam arrow ilə, ${this.name}`);
       };
       innerArrow(); // `this` burada anotherUser, sayHello-dan miras alır
     },
     sayHelloBad: () => { // obyekt metodları üçün pis təcrübə
         console.log(`Salam arrow ilə, ${this.name}`);
     }
   };
   
   anotherUser.sayHello(); // Salam arrow ilə, David
   
   // Brauzerdə, strict rejimdən kənarda
   anotherUser.sayHelloBad(); // Salam arrow ilə, undefined (`this` - window)
   

Kontekstin anlaşılması JavaScript-də obyektlər, metodlar və hadisə idarəediciləri ilə düzgün işləmək üçün çox vacibdir.