1

Написал класс для работы с Ajax-запросами все работает, только после выполнения метода GET() класса Ajax необходимо данные полученные с сервера записать в свойства res того же класса, но на деле в свойства res ничего не записывается, подскажите как это исправить?

class Ajax{
    constructor(url){
        this.res = null;
        this.url = url;
        this.GET(this.url, this.coll);
    }
    GET(url, coll){
        let xhr = new XMLHttpRequest();
        xhr.open('GET', url);
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                coll(xhr.responseText);
            }
        };
        xhr.send();
    }
    coll(data){
        this.res = data;
    }
}

let aj = new Ajax('php/test.php');
console.log(aj.res);

1
  • 1
    записывается. Только позже, чем вы пытаетесь его прочитать.Свойство доступно после того, как только вы получите ответ от сервера. 22 июл 2018 в 14:31

1 ответ 1

0

Функция send() выполняется асинхронно по умолчанию. Если вы хотите чтобы она ваполнялась синхронно, то надо использовать

xhr.open('GET', url, false);

но это будет блокировать выполнение скрипта, пока сервер не вернет значение, что следует избегать. Для этого вам надо чтобы ваша функция GET() вызывалась асинхронно и возвращала Promise. Тогда вы можете

let aj = new Ajax('php/test.php');
aj.GET().then(function(res) {
   console.log(aj.res);
});

Функцию GET нужно переписать

GET(url, coll){
  return new Promise((resolve, reject) => {
    let xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            coll(xhr.responseText);
            resolve(xhr.responseText);
        }
    };
    xhr.send();
 });
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.