This в js является камнем преткновения начинающих разработчиков, все им пользуются, но до конца мало кто понимает, что означает данное ключевое слово в той или иной ситуации.
Во многих языках программирования this привязан к объекту, но в js это не так, this в js зависит от контекста вызова функции, то как и где была вызвана функция.
this вызывает много путаницы, но есть ряд правил, которые позволят вам почти наверняка понять на что указывает this. Их всего четыре.
Если функция вызвана в глобальной области, то this будет указывать на глобальный объект в нестрогом режиме и undefined в строгом режиме работы интерпретатора.
Функции в javascript являются объектами и у них есть свои собственные методы, например, очень полезные для указания this — call, apply и bind, по сути они нужны для одной и той же цели, явно указать this. Рассмотрим метод call для примера. Первым аргументом нужно передать на что будет указывать this. Явная передача this гарантирует, что именно на переданный контекст будет указывать this. Все очень просто.
Функция является методом объекта. Если функцию вызвать как метод объекта, то this будет указывать на тот объект, на котором был вызван метод. Для этого нужно определить функцию внутри объекта.
Если функция была вызвана с оператором New, то this будет указывать на созданный объект, с помощью функции конструктора.
Есть небольшой лайфхак: чтобы точно не потерять this, можно использовать стрелочные функции — this в стрелочных функциях всегда указывает на лексическое окружение в котором она была создана.
Зная эти четыре правила, определить на что указывает this не составит труда. this — очень мощное средство и нужно уметь с ним работать.