Холодные и горячие Observables - в чем разница?
Холодные (cold) и горячие (hot) Observable в RxJS отличаются своим поведением в отношении производителя (producer) и потребителя (consumer) данных. Разберемся с каждым типом подробнее:
-
Холодные (cold) Observable:
-
Холодные Observable создают источник данных и начинают генерировать значения только в момент подписки на них. Каждый подписчик (subscriber) получает свой собственный независимый поток данных.
-
Повторная подписка на холодный Observable приводит к запуску нового потока данных, независимого от предыдущих подписок.
-
Пример кода с холодным Observable:
import { Observable } from 'rxjs' const coldObservable: Observable<number> = new Observable((subscriber) => { let count = 0 const intervalId = setInterval(() => { subscriber.next(count++) }, 1000) return () => { clearInterval(intervalId) } }) // Первый подписчик coldObservable.subscribe((value) => { console.log('Subscriber 1:', value) }) // Подписка через 3 секунды setTimeout(() => { coldObservable.subscribe((value) => { console.log('Subscriber 2:', value) }) }, 3000)
В этом примере, первый подписчик будет выводить значения каждую секунду, начиная с 0. После 3 секунд произойдет вторая подписка, и второй подписчик начнет получать значения, начиная с 0, независимо от первого подписчика.
-
-
Горячие (hot) Observable:
-
Горячие Observable существуют независимо от подписчиков и генерируют данные независимо от них. Подписчики присоединяются к потоку данных, который уже генерируется.
-
Горячие Observable не начинают генерировать значения с момента подписки, и новые подписчики присоединяются к уже существующему потоку данных. Подписчики получают только те значения, которые генерируются после их подключения к Observable.
-
Пример кода с горячим Observable:
import { Observable, Subject } from 'rxjs' const hotObservable: Subject<number> = new Subject() // Генерация значений каждую секунду let count = 0 setInterval(() => { hotObservable.next(count++) }, 1000) // Подписчик 1 hotObservable.subscribe((value) => { console.log('Subscriber 1:', value) }) // Подписчик 2 через 3 секунды setTimeout(() => { hotObservable.subscribe((value) => { console.log('Subscriber 2:', value) }) }, 3000)
В этом примере, общий источник генерирует значения каждую секунду независимо от наличия подписчиков. Первый подписчик получает значения сразу после подключения, а второй подписчик начинает получать значения сразу же после своего подключения, независимо от времени начала генерации значений.
-
В итоге, основное различие между холодными и горячими Observable заключается в том, что холодные Observable генерируют значения для каждого подписчика отдельно, в то время как горячие Observable генерируют значения независимо от подписчиков, и каждый подписчик получает только те значения, которые генерируются после его подключения.