Почему this внутри callback функции filter может быть undefined?

Определение

Контекст выполнения (this) — это объект, к которому привязана функция в момент вызова.

Как вызывается callback в filter

Важно сначала понять, как именно вызывается callback.

1. filter вызывает callback сам

2. Callback не привязан к объекту

3. Вызов выглядит концептуально так:

   callback(element, index, array);
   

Поведение this

1. В обычном режиме:

   • this может указывать на глобальный объект

2. В строгом режиме:

   • this === undefined

"use strict";

[1, 2, 3].filter(function (x) {
  console.log(this); // undefined
  return x > 1;
});

Почему это часто вызывает ошибки

1. Ожидается this из внешнего объекта

2. Но callback — это отдельная функция

3. Контекст теряется

Связь с React

1. В функциональных компонентах this не используется

2. В классовых компонентах подобная ошибка встречается часто

3. Поэтому важно явно управлять контекстом

Вывод

this внутри callback filter может быть undefined, потому что callback вызывается без привязки к объекту, особенно в строгом режиме.