Introduction to RxJS

The Observer pattern done right
- RxJava
- RxJS
- Rx.NET
- UniRx
- RxScala
- RxClojure
- RxCpp
- Rx.rb
- RxPY
- RxGroovy
- RxJRuby
- RxKotlin
- RxSwift
- RxPHP
- RxJS 4: https://github.com/Reactive-Extensions/RxJS
- RxJS 5 (beta): https://github.com/ReactiveX/rxjs
Асинхронность
- Колбеки
- Промисы
- async / await
- Генераторы
Промисы нельзя отменить

FP? RP? FRP?
getPlugins() {
const plugins = [];
if (navigator.plugins) {
for (let i = 0; i < navigator.plugins.length; i++) {
let pluginName = navigator.plugins[i].name;
pluginName += '=1.0';
plugins.push(pluginName);
}
}
return plugins;
}
getPlugins() {
return map(plugin => `${plugin.name}=1.0`, navigator.plugins);
}const square = x => x * x;
const isEven = x => x % 2 === 0;
const sum = (a, b) => a + b;
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
.map(square)
.filter(isEven)
.reduce(sum)Observable
Коллекция асинхронных событий
Могут быть:
- Преобразованы в другие
- Объединены
- Приостановлены
- И не только

Live Coding Time
Два важных нюанса
- subscribe инициирует выполнение
- hot vs cold
Операторы
Примеры
Примеры использования
- Композиция нескольких событий
- debounce, delay
- Управление асинхронными задачами
- При необходимости отмены
Angular 2
- В зависимостях тянет RxJS 4
- Более гибкий EventEmitter
- Работа с http
Альтернативы
- Most.js — https://github.com/cujojs/most
- Kefir — https://github.com/rpominov/kefir
- Bacon.js — https://github.com/baconjs/bacon.js
ES Proposal
function listen(element, eventName) {
return new Observable(observer => {
// Create an event handler which sends data to the sink
let handler = event => observer.next(event);
// Attach the event handler
element.addEventListener(eventName, handler, true);
// Return a function which will cancel the event stream
return () => {
// Detach the event handler from the element
element.removeEventListener(eventName, handler, true);
};
});
}Как узнать больше
The introduction to Reactive Programming you've been missing
Asynchronous Programming in JavaScript
RxJS Koans
Cycle.js
Egghead

Introduction to RxJS
By Pavel Trehubau
Introduction to RxJS
- 558