g1er / Andrew

0 stars 0 forks source link

asynchronous call #2

Closed IgorKulishov closed 6 years ago

IgorKulishov commented 6 years ago

Задание: Выполнить асинхронную загрузку данных используя встроенный метод XMLHttpRequest: I. создать backgroundReadFile:

function backgroundReadFile(url, callback) {
  var req = new XMLHttpRequest();
  req.open("GET", url, true);
  req.addEventListener("load", function() {
    if (req.status < 400)
      callback(req.responseText);
  });
  req.send(null);
}

II. обернуть backgroundReadFile в try catch и подставить значение callback:

try {
  backgroundReadFile("https://jsonplaceholder.typicode.com/posts/1", function(data) {
    if (!data)
      throw new Error("That was unexpected");
    else
      console.log(data);
  });
} catch (e) {
  console.log("Hello from the catch block");
}

Примечание: 1) Теория: Если третьим аргументом open мы передадим true, запрос будет асинхронным. Это значит, что при вызове send запрос ставится в очередь на отправку. Программа продолжает работать, а браузер позаботиться об отправке и получении данных в фоновом режиме (т.е. пока не пришел ответ с сервера, браузер может выполнять другие ф-ции, как только придет ответ с сервера, браузер вновь вернется к дальнейшему выполнению данной ф-ции). 2) URL: Для теста взят открытый (public) тестовый url: https://jsonplaceholder.typicode.com/posts/1, который выдает REST (можешь попробовать в браузере) 3) Выполнить задание в консоле браузера ``

g1er commented 6 years ago

Привет. Я немного затупил... У меня вывелось в консоль "Hello from the catch block", потому что backgroundReadFile - undefined. Не могу понять, почему он считается неопределенным? Потому, что значение data не определено? Я перечитал снова твои объяснения, но вот с этими значениями функций в скобках я не могу разобраться. И я также не могу понять, часть II это та же часть I, обернутая в try catch, или это отдельная часть? Я видимо слишком много времени упустил, потому, что сейчас не могу нормально связать концы с концами.

IgorKulishov commented 6 years ago

Перед выполнением необходимо одновременно скопировать I и II в Console. Для добавления строки после I необходимо нажимать Shift + Enter (в таком случае будет добавлена строка, а не выполнение функции ).

IgorKulishov commented 6 years ago

'"Hello from the catch block", потому что backgroundReadFile - undefined' : это означает, что backgroundReadFile не определена как функция в блоке II, поэтому необходимо (как я написал выше) перед блоком II обязательно скопировать блок I.

IgorKulishov commented 6 years ago

async_get_call

IgorKulishov commented 6 years ago

Мы в нашем примере мы слушаем событие "load" - что означает окончание загрузки информации полученной от сервера. Сначала мы регистрируем слушатель/обработчик события "load", а именно: "req.addEventListener('load', function(){...}" (определенного внутри метода req) , далее мы отправляем "пустой" (без передачи данных) запрос на сервер req.send(null) - таким образом http пакет/сообщение уходит на сервер. Таким образом как только отправленный req.send(null) запрос вернется от сервера обратно, асинхронно выполняемая ф-ция вернется обратно к обработке ответа и вызовется выражение ф-ии определенное в методе req.addEventlistener("load", function(){..}). Дополнительно можешь почитать об addEventListener в той же книге (обработка событий): https://habrahabr.ru/post/244041/

g1er commented 6 years ago

Сегодня все получилось. Я получил в консоль сообщение. Что интересно, в прошлый раз я сделал в принципе то же самое, только не в консоль, а в отдельный html-файл, и потом запустил его в браузере. Но результат был другим, тем, который я тебе присылал. Сегодня, после того, как у меня получилось в консоли, я снова открыл тот файл, ничего в нем не меняя, и вуаля, он сработал как надо. Возможно, именно это сбило меня с толку в прошлый раз. Я начал копаться в коде, пытаться разобраться, и еще больше запутался в итоге. Кстати, не первый раз замечаю, что браузер так ведет себя. Я пишу код, проверяю в баузере, браузер молчит, ничего не делает, и ошибку тоже не пишет. Я бьюсь над кодом в поиске любых ошибок, ворошу гугл, 10 раз перезагружаю окно, в том числе вместе с кэшем страницы, в итоге бросаю все и закрываю. Через некоторое время с восстановленными нервами я снова сажусь разбирать код. Ничего не исправляя, я запускаю прежний код, и вдруг он начинает исправно работать, как надо. Не знаю, что это за волшебство, но периодически случается.