ფუნქციაში კონტექსტი რა არის?

JavaScript-те (this) контекст аныкталган функцияны кандайча чакырганыңызга жараша болот, ал анын кайда жарыяланганына эмес. Ал функциянын тиешелүү объектине же аны чакырган объектке шилтеме кылат.

Контекстти аныктоо жолдору:

1. Глобалдык контекст: функциядан тышкары же функция так объект менен чакырылбаса (this браузерде глобалдык объект window болот, Node.jsде global, же strict режимде undefined).

   // Браузерде
   console.log(this === window); // чын
   
   function showContext() {
     console.log(this);
   }
   
   showContext(); // window
   

2. Объекттин контексти (метод): Эгер функция объекттин методу катары чакырылса (obj.method()), анда this ошол объектке шилтеме кылат.

   const user = {
     name: 'Alice',
     greet: function() {
       console.log(`Салам, мен ${this.name}`);
     }
   };
   
   user.greet(); // Салам, мен Alice
   

3. Курулмочу контекст: Функция new менен чакырылса (new MyClass()), жаңы объект түзүлөт жана this ошол жаңы объектке шилтеме кылат.

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

4. Ачык көрсөтүлгөн контекст: call, apply жана bind методдору this маанисин так белгилөөгө мүмкүндүк берет.

   • call(thisArg, arg1, arg2, ...): функцияны белгилүү this менен жана аргументтер менен чакырат.
   • apply(thisArg, [argsArray]): функцияны белгилүү this менен жана массив түрүндөгү аргументтер менен чакырат.
   • bind(thisArg, arg1, arg2, ...): жаңы функция түзүп, анын this-и белгиленет.

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

5. Жебе функциялары: Жебе функциялар өзүнүн this-и жок. Алар лексикалык чөйрөдөн this-ди мурас катары алат (алар аны аныктоочу жерде).

   const anotherUser = {
     name: 'David',
     sayHello: function() {
       const innerArrow = () => {
         console.log(`Салам жебе, ${this.name}`);
       };
       innerArrow(); // `this` бул жерде - anotherUser, мурас алган sayHello'дон
     },
     sayHelloBad: () => { // жаман пракси объекттин методдору үчүн
         console.log(`Салам жебе, ${this.name}`);
     }
   };
   
   anotherUser.sayHello(); // Салам жебе, David
   
   // Браузерде, strict режимден тышкары
   anotherUser.sayHelloBad(); // Салам жебе, undefined (this - window)
   

Контекстти түшүнүү JavaScript объекттери, методдору жана иш-чара иштетүүчүлөрү менен иштөөдө маанилүү.