Sobes.tech
Junior

Маънои контекст дар функсия чист?

sobes.tech AI

Ҷавоб аз AI

Мазмуни (this) дар функсияи JavaScript муайян мешавад аз он чӣ гуна даъват карда шудааст, на аз он ки дар куҷо эълон шудааст. Он ба объект ишора мекунад, ки ба он функсия тааллуқ дорад ё ки онро даъват мекунад.

Роҳҳои муайян кардани мазмун:

  1. Мазмуни глобалӣ: дар берун аз функсияҳо, ё агар функсия бе объекти равшан даъват карда шавад (this ба объектии глобалӣ window дар браузер, global дар Node.js, ё undefined дар режими strict).

    // Дар браузер
    console.log(this === window); // true
    
    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 муҳим аст.