Jest 等 JavaScript 测试框架中 expect 的多种用法

在前端开发中，测试是不可或缺的一部分。而测试框架的选择也是至关重要的。Jest 是一个流行的 JavaScript 测试框架，它提供了丰富的 API 和工具，方便开发人员编写测试用例。其中，expect API 是 Jest 中最常用的一个，本文将介绍 expect API 的多种用法，帮助读者更好地理解和使用 Jest 进行测试。

expect 的基本用法

expect API 是 Jest 中用于断言的主要 API，它可以用来判断一个值是否符合预期。它的基本用法如下：

test('two plus two is four', () => {
  expect(2 + 2).toBe(4);
});

在上面的代码中，我们使用 expect API 来判断 2 + 2 是否等于 4。其中，toBe 方法是 expect API 中的一个方法，用于判断期望值是否等于实际值。如果判断成功，则测试通过；否则测试失败。

expect 的链式调用

expect API 还支持链式调用，这使得我们可以在一个语句中进行多个断言。例如，我们可以使用 toBe 和 toEqual 方法来判断两个值是否相等：

test('object assignment', () => {
  const data = { one: 1 };
  data['two'] = 2;
  expect(data).toEqual({ one: 1, two: 2 });
});

在上面的代码中，我们首先创建了一个对象 data，然后向其中添加了一个属性 two。接着，我们使用 toEqual 方法来判断 data 是否等于 { one: 1, two: 2 }。如果判断成功，则测试通过。

expect 的反向判断

除了 toBe 和 toEqual 方法之外，expect API 还支持一些其他的方法，例如 toBeTruthy 和 toBeFalsy。这些方法用于判断一个值是否为真或假。例如，我们可以使用 toBeFalsy 方法来判断一个值是否为假：

test('null', () => {
  const n = null;
  expect(n).toBeFalsy();
});

在上面的代码中，我们创建了一个 null 值，并使用 toBeFalsy 方法来判断它是否为假。如果判断成功，则测试通过。

expect 的异常判断

有时候我们需要测试一个函数是否会抛出异常。这时候，我们可以使用 expect API 中的 toThrow 方法。例如，我们可以使用 toThrow 方法来测试一个函数是否会抛出异常：

function throwError() {
  throw new Error('error');
}

test('throw error', () => {
  expect(throwError).toThrow();
});

在上面的代码中，我们定义了一个函数 throwError，它会抛出一个异常。接着，我们使用 toThrow 方法来测试这个函数是否会抛出异常。如果测试通过，则说明函数在执行时抛出了异常。

expect 的异步判断

有时候我们需要测试一个异步函数的返回值。这时候，我们可以使用 expect API 中的异步方法来进行判断。例如，我们可以使用 async 和 await 关键字来测试一个异步函数的返回值：

// www.javascriptcn.com code example
function fetchData(callback) {
  setTimeout(() => {
    callback('data');
  }, 100);
}

test('fetch data', async () => {
  const data = await new Promise(resolve => fetchData(resolve));
  expect(data).toBe('data');
});

在上面的代码中，我们定义了一个异步函数 fetchData，它会在 100 毫秒后返回一个字符串 'data'。接着，我们使用 async 和 await 关键字来等待 fetchData 函数的返回值。最后，我们使用 expect API 来判断返回值是否等于 'data'。如果测试通过，则说明异步函数的返回值符合预期。

结语

本文介绍了 Jest 中 expect API 的多种用法，包括基本用法、链式调用、反向判断、异常判断和异步判断。这些用法可以帮助开发人员更好地使用 Jest 进行测试，提高代码的质量和可靠性。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d1392da941bf7134296e3e