Angular 测试中 fakeAsync 和 async 有什么区别

typescript

在 Angular 测试中，fakeAsync 和 async 是两种不同的测试方式。它们的主要区别在于它们处理异步代码的方式不同，以及它们在测试用例中的使用场景不同。

首先，我们来看一下 fakeAsync。fakeAsync 是 Angular 提供的一种测试工具，它可以“虚拟”时间的流逝，使得所有的异步操作都变成同步操作。在使用 fakeAsync 进行测试时，我们可以使用 tick 函数来模拟时间的流逝，从而等待异步操作完成。这样，我们就可以在测试用例中像处理同步代码一样处理异步代码，使得测试用例的编写更加简单和直观。

下面是一个使用 fakeAsync 进行测试的示例代码：

typescript
it('should update the value asynchronously', fakeAsync(() => {
  let value: string;
  asyncService.getValue().subscribe(val => {
    value = val;
  });
  tick(100);  // 等待 100 毫秒，模拟异步操作完成
  expect(value).toBe('test value');
}));

在上面的示例中，我们使用 fakeAsync 包裹了测试用例的函数体，并在其中调用了异步服务的方法来获取一个值。然后，我们使用 tick 函数等待 100 毫秒，模拟异步操作完成。最后，我们断言获取到的值是否符合预期。

接下来，我们来看一下 async。async 是另一种 Angular 提供的测试工具，它使用了 JavaScript 的异步机制来处理异步代码。在使用 async 进行测试时，我们可以使用 awAIt 关键字来等待异步操作完成。与 fakeAsync 不同的是，async 并不会“虚拟”时间的流逝，而是真实地等待异步操作完成。

下面是一个使用 async 进行测试的示例代码：

typescript
it('should update the value asynchronously', async () => {
  let value: string = awAIt asyncService.getValue().toPromise();
  expect(value).toBe('test value');
});

在上面的示例中，我们使用 async 修饰测试用例的函数体，并在其中使用 awAIt 关键字等待异步服务的方法返回一个 Promise 对象。然后，我们将获取到的值赋给变量，并断言其是否符合预期。

fakeAsync vs async

上面我们介绍了 fakeAsync 和 async 两种测试方式的基本用法和区别。下面我们来一下它们的不同之处：

1. fakeAsync 是一种“虚拟”时间流逝的测试方式，能够将异步操作转变为同步操作，使用 tick 函数模拟时间的流逝；而 async 则是一种真实地等待异步操作完成的测试方式，使用 awAIt 关键字等待异步操作。

2. fakeAsync 更适合处理一些需要模拟时间流逝的场景，比如定时器、动画等；而 async 则更适合处理一些需要真实等待异步操作完成的场景，比如网络请求、异步任务等。

3. fakeAsync 提供了更简洁和直观的测试用例编写方式，使得代码更易读、易写；而 async 需要使用 awAIt 关键字，并且需要将返回的 Observable 转为 Promise 对象，使得代码相对繁琐一些。

fakeAsync 和 async 是 Angular 测试中两种不同的测试方式，它们在处理异步代码和使用场景上有所不同。我们可以根据具体的测试需求选择合适的方式来编写测试用例，以确保测试的准确性和可靠性。

在 Angular 测试中，我们经常会遇到异步操作的测试场景。为了简化测试用例的编写和提高测试的可读性，Angular 提供了 fakeAsync 和 async 两种测试方式。fakeAsync 虚拟时间流逝，将异步操作转为同步操作；async 则真实等待异步操作完成。根据具体的测试需求，我们可以选择合适的方式来编写测试用例，以确保测试的准确性和可靠性。