为什么测试断言进入订阅通过而不在异步区域中?

Why does test asserts into a subscription pass without being in the async zone?

当 运行在 Angular2+ 中使用 Karma 和 Jasmine 进行测试并订阅可观察对象时,该订阅(据我所知)是 运行 异步的,所以测试应该被包装成一个 asyncfakeAsync.

但是我们不使用async而不是fakeAsync,测试通过了,所以我的问题是:subscribe中的代码以前不是异步的吗?为什么测试通过?怎么回事?

hello.component.ts

import { Component, Input, OnInit } from '@angular/core';
import {of} from 'rxjs';

@Component({
  selector: 'hello',
  template: `<h1>Hello {{name}}!</h1>`,
  styles: [`h1 { font-family: Lato; }`]
})
export class HelloComponent implements OnInit  {
  name: string;

  ngOnInit() {
    // Subscribing to sayName() to get a name
    this.sayName().subscribe(name => this.name = name);
  }

  sayName() {
    return of('Foo');
  }
}

hello.component.spec.ts

import { CommonModule } from '@angular/common';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import {HelloComponent} from './hello.component';

describe('HelloComponent', () => {
  let fixture: ComponentFixture<HelloComponent>;
  let component: HelloComponent;


  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        CommonModule
      ],
      declarations: [HelloComponent],
      providers: [
      ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(HelloComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should have foo name', () => {
    // Running out of async/fakeAsync
    // and asserting we got the name
    expect(component.name).toEqual('Foo');
  });
});

您也可以签入 Stackblitz 这个例子。

subscribe() 是一个同步调用。在您的情况下,在此调用期间创建订阅,发出值并调用观察者。再一次:所有这些都发生在 subscribe 被执行的时候!

当您创建一个 Observable 时,例如interval() 值将异步发出。之前的一切仍然同步发生。

当您使用 subscribeOn() 运算符时,即使订阅也会异步创建。

与承诺相反,默认情况下反应流不是异步的。并且如前所述,整个过程的不同部分可以独立地异步化。

如果您想更深入地研究该主题,我无耻地推荐我的文章 Concurrency and Asynchronous Behavior with RxJS。很短 ;)