Возможно ли получить this внутри функции стрелки, а также глобальную this?

Question

У меня есть:

        checkbox.addEventListener('change', () => {
            console.log(this.checked)
        })

Проблема в том, что this.checked не определено из-за функции стрелки.Итак, как я могу проверить значение флажка?Я знаю, что могу использовать обычный function, но я хочу сохранить this во внешней области видимости, так как я буду вызывать некоторые функции из него

Answer 1

Поражает назначение функций стрелок. Используйте объект события, чтобы получить ссылку на элемент, по которому щелкнули.

checkbox.addEventListener('change', (event) => {
  console.log(event.target.checked)
})

И вы также определили флажок как переменную, чтобы вы могли использовать это

checkbox.addEventListener('change', (event) => {
  console.log(checkbox.checked)
})

Answer 2

То, что я делал раньше при работе с этим типом инкапсуляции области, - это использование переменной для сохранения «this» для последующего использования.

var me = this;
checkbox.addEventListener('change', () => {
    console.log(me.checked)
})

Использование такой переменной может привести к значительному использованию памяти, так как вы продолжаете добавлять ссылки на вещи, которые в конечном итоге должны быть собраны сборщиком мусора, так что будьте осторожны с этим слишком много.

И всегда есть возможность получить / найти правильный элемент для проверки статуса. Это, вероятно, будет использовать меньше ресурсов в долгосрочной перспективе и не окажет значительного влияния на скорость вашего приложения.

Даже если вам нужно использовать другой контекст для проверки статуса вашего флажка / переключателя, вы по крайней мере сможете выяснить, что такое контекст «я».