Функция стрелка не работает внутри нагрузки AJAX.Но если я напишу это как нормальную функцию, то это работает

Question

Когда я использую функцию стрелки в xhr.onload, я не получаю ответ. Однако, если я использую обычную функцию, такую ​​как xhr.onload = function(){}, я получаю ответ. Почему код раньше не работал так, как он работает при использовании xhr.onload = function(){}?

let btn = document.getElementById("button");

btn.addEventListener("click" , function(){
let xhr = new XMLHttpRequest();
xhr.open("GET" , "sample.txt" , true);
xhr.onload = () => {
    if(this.status === 200){
         console.log(this.responseText);
    }
}
xhr.send();
})

Answer 1

Контекст этой функции onload должен быть исходным XMLHttpRequest, но при использовании функции стрелки у вас нет назначенного контекста, поэтому он, скорее всего, будет родительской областью или окном. Это будет проблемой.