Контекст в JS (this) [дубликат]

#javascript #функции #область_видимости

        
             
                
                    
                        
                            На этот вопрос уже даны ответы здесь:
                            
                        
                    
                
                        
                            Потеря контекста вызова
                                
                                    (5 ответов)
                                
                        
                                Закрыт 2 года назад.
            
                    
Правильно ли я понимаю, что в этом коде в 1-м варианте так как у стрелочных функций
нету this она берет this у "родителя" , а во 2-м варианте this вообще нету поэтому
будет ошибка?



const user = {
  name: 'Bob',
  city: ["Madrid", 'Rome', 'LA'],
  printLocation: function() {
    this.city.forEach(city => {
      console.log(`${this.name} live in ${city}`)
    })
  }
}

user.printLocation()

const user2 = {
  name: 'Bred',
  city: ["Madrid", 'Rome', 'LA'],
  printLocation: () => {
    this.city.forEach(city => {
      console.log(`${this.name} live in ${city}`)
    })
  }
}

user2.printLocation()



    

Ответы

Ответ 1

а во 2м варианте this вообще нету


this есть, но в данном случае ссылается он на объект window. В стрелочных функциях,
this подхватывает значение лексического контекста. Если простым словами, то значение
this внутри стрелочной функции, будет таким же, как и снаружи. Однако, в ES6 появились
именно методы объекта и для более короткого синтаксиса, можете использовать их:



const user = {
  name: 'Bred',
  city: ["Madrid", 'Rome', 'LA'],
  printLocation() {
    this.city.forEach(city => {
      console.log(`${this.name} live in ${city}`);
    });
  }
};
user.printLocation();


Ответ 2

const user = {
  name: 'Bob',
  city: ["Madrid", 'Rome', 'LA'],
  printLocation: function() {
    this.city.forEach(city => {
      console.log(`${this.name} live in ${city}`)
    })
  }
}

user.printLocation()

const user2 = {
  name: 'Bred',
  city: ["Madrid", 'Rome', 'LA'],
  printLocation: () => {
    user2.city.forEach(city => {
      console.log(`${user2.name} live in ${city}`)
    });
  }
}

user2.printLocation()