Вход

Просмотр полной версии : Присваивание при выполнении ajax


yintar
14.12.2018, 22:05
Здравствуйте.
Никак не могу понять такой момент.


var a;
const myButton = document.querySelector('#myButton');
const content = document.querySelector('#content');
myButton.addEventListener('click', function () {
const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://testhtml/some.php');
xhr.send();

xhr.addEventListener('load', function () {
a = xhr.responseText;
console.log(a);
return a;
});
});

console.log(a);


В этом коде вроде все просто.Делаю аякс запрос ,получаю данные и результат записываю в переменную a которая объявлена перед аякс запросом. Затем я хочу использовать эту переменную a, с записанным в нее значением полученным в результате аякс запроса ,но уже использовать эту переменную после аякс запроса, но здесь console.log(a); я получаю undefined.......

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

Объясните, это ,пожалуйста, можно на примере моего кода.
Всем спасибо.

Nexus
14.12.2018, 22:42
Вы не понимаете, как работает ваш код.
Как будет выполняться ваш код:
var a;//Шаг 1
const myButton = document.querySelector('#myButton');//2
const content = document.querySelector('#content');//3
myButton.addEventListener('click', function () {//4, только объявление обработчика, не его выполнение
const xhr = new XMLHttpRequest();//6, эта строка будет выполнена только после того, как по кнопке кликнут
xhr.open('GET', 'http://testhtml/some.php');//7
xhr.send();//8

xhr.addEventListener('load', function () {//9, объявление обработчика, не его выполнение
a = xhr.responseText;//10, эта строка будет выполнена, только когда запрос завершится успешно
console.log(a);//11
return a;//12, эта строка бесполезна, можно удалить
});
});

console.log(a);//5, значение переменной все еще undefined

Чтобы вам иметь возможность работать с результатами запроса, код нужно писать в обработчике события load объекта xhr.


К удивлению, ничего внятного в сети по асинхронности быстро найти не удалось.

yintar
14.12.2018, 23:54
последовательность выполнения я примерно понимаю (то ято вы расписали по строкам), но в том то и вопрос можно ли возвратить значение (или присвоить его переменной) , которое прислал сервер, чтобы в дальнейшем использовать его??????? ну например как с обычной функцией, когда функция возвращает значение,
или тут так нельзя??? почему??? объясните плиз, а то действительно не могу найти нигде ответа на этот вопрос.

laimas
14.12.2018, 23:58
можно ли возвратить значение (или присвоить его переменной) , которое прислал сервер, чтобы в дальнейшем использовать его?

if(!var) запрос, иначе используем

yintar
15.12.2018, 00:04
Не понял вас, напишите плиз применительно к моему коду

laimas
15.12.2018, 00:16
напишите плиз применительно к моему коду

А чего там писать?

console.log(что-то) - ну не ради этого же это что-то объявлено, так ведь? Если это будет использоваться, например, после щелчка/выбора/итп элемента на странице, то в общем то не нужны запросы с клиента, сервер при выдачи страницы может сразу отдать. Или при загрузке страницы запросить и присвоить возвращенное.

Можно проверить - если значение не определено, то делаем запрос и присваиваем, затем используем, иначе используем. Но опять возникает вопрос чему и по каким условиям это требуется?

Поэтому не понять какой истинный смысл вложен в "запомнить и использовать", а о "классике" вам сказали выше - запросили, получили ответ, тут же не отходя от кассы используем.

yintar
15.12.2018, 01:02
laimas ну что же непонятного я же все очень подробно описал.!!!!!!!!!!!
Ну вот такой пример : мне нкжно получить массив каких то значени с сервера, а потом этот массив отдать в другой объект или в функцию в качестве параметра. так вот данные я то получаю без проблем, но записать их куда-то вне обработчика аякса (т.е. там где я их получаю ) не могу.........вот в этом и вопрос, а console.log() это ж для примера, вместо console.log() может быть функция , которой нужен этот ответ сервера.......

laimas
15.12.2018, 08:46
Есть переменная А в глобальной области видимости, есть функция С, которая работает с данными А, есть кнопка В, в обработчике щелчка которой:
1) проверяется есть ли в А параметр Х
2) если параметр есть, то управление передается функции С
3) если параметра нет, то делается запрос на сервер
4) по ответу сервера запрошенный параметр сохраняется в А и управление передается функции С