Виктор Русакович, Минск, Web-developer c 6-ти летним опытом разработки, компания GP Software.travel
«Реактивный JavaScript. Победа над асинхронностью и вложенностью». Development секция. Для разработчиков. Высокий уровень подготовки.
«Непрерывная интеграция сложного проекта. Кто всё сломал?». IT секция. Agile отделение. Для всех уровней подготовки.
3. Что не так с событиями?
● как компоновать?
● как фильтровать?
● как собирать данные от разных событий?
● как не сойти с ума от асинхронности?
● как не строить Пирамиды Обратных
Вызовов?
● … (еще примерно 42 пункта)
5. О ужасный callback!
step1(function (value1) {
step2(value1, function(value2) {
step3(value2, function(value3) {
step4(value3, function(value4)
{
// Do something with
value4
});
});
});
});
6. О ужасный callback! (и доступ к данным)
step1(function (value1) {
step2(value1, function(value2) {
step3(value2, function(value3) {
if (value2 === 4) return null
step4(value3, function(value4)
{
if (value2 > value3)
work() });
});
});
});
7. Варианты решения а-ля promise...
Q.fcall(step1)
.then(step2)
.then(step3)
.then(step4)
.then(function (value4) {
// Do something with value4
})
.done();
https://github.com/kriskowal/q/
A tool for making and composing asynchronous promises in JavaScript (282 362 forks at
Github).
8. ...или настоящими promise
function successFunc(){ console.log( “success!” ); }
function failureFunc(){ console.log( “failure!” ); }
$.when(
$.ajax("/main.php" ),
$.ajax("/modules.php" ),
$.ajax(“/lists.php” )
).then( successFunc, failureFunc );
Все равно не хватает контроля над данными!
9. Reactive Extensions for
JS
...is a library to compose asynchronous and
event-based programs using observable
collections and LINQ-style query operators.
11. Состав RxJS:
● объекты для представления асинхронных
потоков данных
● операторы для создания, фильтрации и
управления подобными объектами и
данными внутри них
● немного магии
12. Реактивное программирование
- парадигма, ориентированная на потоки данных и
распространение изменений.
Это означает, что должна существовать возможность
легко выражать статические и динамические потоки
данных, а также то, что выполняемая модель должна
автоматически распространять изменения сквозь
поток данных.
13. 2 примера реактивности из жизни
1. Excel 2. Ищем работу:
обзванивать
вакансииpull vs
разместить резюме
ждать звонков
push
21. Состав RxJS:
● объекты для представления асинхронных
потоков данных
● операторы для создания, фильтрации и
управления подобными объектами и
данными внутри них
● немного магии
22. Операторы объединения
● Amb
● Merge
● Concat
● CombineLatest
● Zip
● Repeat
stream y
stream x
result
result = fn(x, y, …, n)
23. Операторы фильтрации и выбора
● where (filter) / whereTrue / whereFalse
● take / takeUntil / takeWhile
● skip / skipUntill / skipWhile
● select (map) / selectMany / selectProperty
stream x
result
result = fn.apply(x)
24. Операторы для данных
● scan
● count
● min
● max
● groupBy
● distinct / distinctUntilChanged
● throttle
41. Вредные советы
● одноразовые потоки
● потоки-сироты
● превращаем все события в потоки, все!
● общие названия потоков (dataStream)
● свои операторы не читая документацию
42. Полезные советы
● простые данные в сообщениях
● говорящие названия для потоков
● простая логика для объединения
● промежуточные потоки
● функциональный подход