Где выполняются Наблюдаемые подписчики

Question

Я пытаюсь понять наблюдаемые Angular и то, вызываются ли подписанные функции асинхронно или в цикле событий Javascript. Например, если я сделаю следующий вызов:

    this.http.get<Result>('http://www.example.com').subscribe(result => {
        // Do something with result that affects the UI
    });

, я понимаю, что фактический сетевой запрос и ответ, то есть get, выполняется асинхронно, но функция result => {} выполняется в рамках той же асинхронной задачи илив цикле событий Javascript?

Причину, по которой я спрашиваю, следует избегать в комментарии кода: // Do something with result that affects the UI

Answer 1

На самом деле, асинхронные запросы обратного вызова и подписанные функции также добавляются в цикл событий, в частности, в очередь задач и помещаются в стек, когда он пуст для выполнения. Здесь - более подробное объяснение и ссылка на него этого отличного видео для Филиппа Робертса о цикле событий.

Answer 2

Все зависит от типа наблюдаемой, есть горячие и холодные наблюдаемые. Пример, который вы приведете, будет генерироваться после выполнения http-вызова, наблюдения, созданного с использованием или субъекта поведения, будет работать синхронно, как только будет создана подписка.

Посмотрите исходный код субъекта поведения

https://github.com/ReactiveX/rxjs/blob/master/src/internal/BehaviorSubject.ts

и вы увидите, что далее вызывается при подписке.

Все зависит от типа наблюдаемого.

Answer 3

https://rxjs -dev.firebaseapp.com / guide / scheduler

null Если не передать планировщик, уведомления доставляются синхронно и рекурсивно. Используйте это для операций с постоянным временем или хвостовых рекурсивных операций.

По умолчанию синхронно, и наблюдаемая http не устанавливает планировщик

angular http observable

Но на ваш вопрос, я полагаю, вы устанавливаете свойство компонента, который используется в шаблоне. Если вы не используете onPush в своем компоненте, установка значения в блоке подписки будет отображать это изменение.

Если вы не используете значения из подписки в нескольких местах, лучший способ использовать подписку в шаблонеэто сделать что-то вроде этого:

myexampledata = this.http.get<Result>('http://www.example.com')

тогда в шаблоне

{{myexampledata | async}}

Подписки и отписки будут обрабатываться фреймворком. Если вам нужно каким-либо образом изменить форму данных для отображения, вы можете сопоставить значения с тем, что вы хотите

myexampledata = this.http.get<Result>('http://www.example.com')
.pipe(
     map(returnedvalue => returnedvalue.whatiminterestedin)
)

Если вы установите свойство компонента, который вы используете в шаблоне, тоОбнаружение изменения угла будет обрабатывать обновление.