Базове опис асинхронного коду
Очікується, що в консолі ми побачимо "a", "b", а потім через приблизно 500 мс - "c", "d", і "e". Я використовую термін "приблизно" тому, що в дійсності setTimeout працює непередбачувано. Навіть в специфікації HTML5 зазначено: "Таким чином, API не гарантує, що таймер виконається точно за розкладом. Вірогідні затримки через навантаження процесора, інших завдань та інших факторів."
Цікаво, що таймаут не виконуватиметься до тих пір, поки увесь інший код в блоці не виконається. Тобто, якщо встановлений таймаут, а потім якась функція виконується довго, то таймаут не почне відраховуватися, поки функція не завершиться. У реальності, асинхронні функції setTimeout і setInterval ставляться в чергу, відому як цикл подій.
Асинхронне отримання даних за допомогою методу jQuery $ .ajax є простим крос-браузерні процесом, який приховує реальний процес. наприклад:
Зазвичай, але неправильно, передбачається, що дані стануть доступні відразу після виклику $ .ajax. Але дійсність виглядає інакше:
Об'єкт XmlHttpRequest (xmlhttp) відправляє запит, а поворотна функція обробляє подія об'єкта readystatechange. Потім xmlhttp виконує метод send. У міру роботи xmlhttp, подія readystatechange генерується кожен раз при зміні властивості readyState. і тільки коли xmlhttp закінчить отримання відповіді від віддаленого хоста, буде виконуватися поворотна функція.
Робота з асинхронним кодом
Багато функцій в node.js є асинхронними. Тому часто можна зустріти подібну ситуацію:
А на стороні клієнта можна зустріти такий код:
Вкладені поворотні функції дійсно можуть викликати огиду. Але є кілька рішень для такого стилю кодування. Проблема не в мові програмування, а в тому, як програмісти використовують його.
іменовані функції
Просте рішення для розгрібання завалів зворотних функцій - уникати вкладення глибше, ніж на два рівня. Замість передачі анонімної функції в аргумент поворотній функції використовуйте іменовану функцію:
Додатково бібліотека async.js може допомогти обробити множинні запити / відповіді AJAX. наприклад:
Даний код виконує дві асинхронні функції, і кожна функція приймає поворотну функцію "done", яка виконується після завершення асинхронної функції. Коли обидві зворотних функції "done" завершаться, поворотна функція для parallel виконається для обробки всіх помилок або результатів обох асинхронних функцій.
Обіцянка (promise)
Обіцянка представляє подієвий подія, що повертається з одиничного завершення операції.
Існує багато бібліотек, які мають шаблон обіцянок. jQuery використовує відмінний API обіцянок. Об'єкт Deferred з'явився у версії 1.5, і конструктор jQuery.Deferred використовується у функціях, які повертають обіцянки. Функції, які повертають обіцянки, виконують деякий вид асинхронних операцій.
Тут допускається виконання двох асинхронних функцій, очікується їх результат і потім виконується інша функція з результатами перших двох викликів.
В даному коді метод geocode виконується двічі і повертає обіцянку. Потім виконується асинхронна функція і викликає resolve в своїй поворотній функції. Потім, як тільки проходять обидва виклику resolve. виконується then. повертає результат перших двох викликів geocode. Результати передаються в getRoute. який також повертає обіцянку. На завершення, коли обіцянку з getRoute дозволяється, виконується поворотна функція doSomethingCoolWithDirections.
Події є іншим рішенням для зв'язку, коли асинхронні поворотні функції закінчують виконання. Об'єкт може стати емітером і генерувати подія, яка буде відловлювати інший об'єкт. Такий тип роботи з подіями називається шаблоном спостереження (observer pattern). Бібліотека backbone.js використовує такий функціонал за допомогою Backbone.Events.
Існують інші бібліотеки, які використовують таку модель роботи з подіями, такі як jQuery Event Emitter. EventEmitter. monologue.js і node.js має модуль EventEmitter.
Ніколи не повертайте обіцянок через публічні API. Така практика прив'язує користувачів API до обіцянок і ускладнює модернізацію коду. Але комбінація обіцянок для внутрішніх потреб і подій для зовнішніх API може привести до появи відмінного розв'язаного і легко обслуговується додатки.
Такий підхід дозволяє іншим областям додатки відповідати асинхронним поворотним функцій без прямих посилань на об'єкт, що генерує запит. що робить можливим оновлення кількох областей на сторінці коли виходить напрямок. У стандартній конфігурації jQuery Ajax при зміні п = напрямку потрібно успішний виклик зворотної функції. Такий підхід важко обслуговувати, а використання повідомлень істотно полегшує оновлення множинних областей інтерфейсу користувача.
Інші реалізації шаблону з посередником використовуються в бібліотеках amplify. PubSubJS і radio.js.
висновок
За рахунок отримання інформації відразу по двох каналах (зір і слух) ефективність навчання значно перевершує навчання по книгах. А домашні завдання і онлайн-тести дозволять вам постійно думати на мові, що вивчається і відразу перевіряти свої знання!
Якщо ви давно хочете як слід вивчити HTML, то у мене для Вас є чудова новина!
Якщо ви вже вивчили HTML і хочете рухатися далі, то наступним кроком буде вивчення технології CSS.
Якщо ви хочете розібратися з поняттями домену і хостингу, навчитися створювати бази даних, закачувати файли сайту на сервер по FTP, створювати піддомени, налаштовувати поштові скриньки для свого сайту і стежити за його відвідуваністю, то цей курс створений спеціально для вас!