Почему оператор this в Javascript несовместим?

В JavaScript оператор this ведет себя по-разному в зависимости от контекст вызова. Это может привести к путанице и неожиданным результатам, особенно при работе с обратными вызовами и объектами.

Шаблоны вызова и привязка this

Оператор this привязан к объект или класс во время вызова функции, и эта привязка определяется шаблоном вызова:

• Метод: При вызове как метод объекта «this» относится к сам объект.
• Функция: При вызове как отдельная функция «this» ссылается на глобальную область видимости (объект окна в браузерах).
• Конструктор: При вызове с ключевым словом «new» создается новый объект, и «this» указывает на этот объект.
• Применить: Метод «применить» позволяет явно установить «this» и передача аргументов в массиве.

Загадка обратного вызова

Проблема возникает, когда обратный вызов метода вызывается как функция. Поскольку обратные вызовы не вызываются как методы, «this» относится к глобальной области, а не к объекту, для которого он изначально предназначался.

Рекомендации

Одна стратегия поддержки Согласованность привязки «this» внутри обратных вызовов заключается в использовании «var that = this;» шаблон. При этом ссылка на «this» (объект) присваивается новой переменной («that»), которую затем можно использовать в обратном вызове.

Другой рекомендуемый подход — использовать аспект функционального программирования JavaScript и избегать использования классов. и модели наследования. Используя чистые функции и функции высшего порядка, вы можете отделить логику от состояний объекта и получить более модульный и предсказуемый код.

Кроме того, рассмотрите возможность использования инфраструктуры JavaScript, которая предоставляет механизмы для обработки «этой» привязки и объектно-ориентированных операций. ориентированное программирование последовательным образом. Не забудьте внимательно просмотреть документацию и особенности платформы, чтобы избежать неожиданного поведения.