Observable — это новый тип, который был представлен 5 лет назад библиотекой Microsoft Reactive Extensions. Это моя попытка представить их простыми словами.
В статье Асинхронный JavaScript с реактивными расширениями Джафар Хусейн говорит:
Observable — это просто набор элементов во времени.
Это действительно отличное краткое описание Observables, и оно исходит из
прозрения Джафара, когда он работал в Microsoft, и Эрик Мейер спросил его об этом (я перефразирую):
В чем разница между коллекцией и мероприятием?
Когда вы смотрите на эти два бок о бок на более высоком уровне, их действительно не так уж много разделяет:
Действительно они такие же. Они оба коллекции. Один представляет собой коллекцию в пространстве, а другой — коллекцию на временной шкале.
Рассмотрение событий таким образом привело к выводу, что вы должны иметь возможность преобразовывать передаваемые вам данные о событиях так же, как вы можете это делать с коллекциями.
Что это обозначает?
В JavaScript у нас есть индексированные коллекции, и мы называем их массивами. У этих массивов есть куча аккуратных методов итерации, которые позволяют вам перебирать все элементы массива разными способами и возвращать новый массив по завершении. Они не мутируют данные в исходном массиве. Вы также можете связать эти функции, что делает довольно сложные преобразования данных довольно простыми.
Одной из таких функций массива является «карта». Map перебирает исходный массив
и передает каждый элемент исходного массива в функцию обратного вызова. Обратный вызов
затем может что-то сделать с этим элементом, и все, что возвращает эта функция,
становится элементом результирующего нового массива, который имеет ту же длину, что и исходный массив.
Вот простой пример с нашим массивом координат, в котором мы преобразуем
массив координат в массив, содержащий только координаты x:
Теперь у нас есть массив, содержащий значения координат x, но нас
интересуют только координаты x больше 2.
К счастью, мы можем просто связать функцию «фильтр» с функцией карты.
Функции фильтра выполняют итерацию по массиву и возвращают новый массив, содержащий все элементы, для которых функция обратного вызова, переданная фильтру, возвращает «истину».
И вот как мы это делаем:
Итак, теперь у нас есть массив только с двумя значениями x, которые больше 2
, и мы можем что-то делать с ним в пользовательском интерфейсе.
Хорошо, помните, как я сказал, что с Observable мы можем делать то же самое с данными, которые нам передаются?
Возьмем, к примеру, поток событий щелчка мыши. Представьте, что по какой-то причине мы хотим немедленно реагировать на каждый клик мыши по документу, но только на те, координата x которых больше 100.
С Observables мы можем сделать это, просто используя функции массива.
Конечно, этот пример очень упрощен, но, тем не менее, он демонстрирует мощь
исходной идеи о том, что события — это просто коллекции на временной шкале. Вместо
результата в виде массива (коллекции в пространстве) данные проходят через функции массива
одна за другой (коллекция во времени) и могут быть обработаны в
функции подписки one одним.