在前端开发中，测试是不可或缺的一部分。而 Jest 是一款流行的 JavaScript 测试框架，它提供了丰富的测试工具和 API，方便开发者编写和运行测试用例。在使用 Jest 进行测试时，mock 是一个常用的技术手段，它可以模拟各种场景，使得测试更加全面和可控。但是，在使用 mock 时，有时会遇到一些子类相关的问题，本文将介绍这些问题及其解决方式。
问题描述
在 Jest 测试中，我们经常需要使用 mock 来模拟一些对象或函数。例如，我们可以使用 jest.fn() 来创建一个 mock 函数，然后在测试中通过 expect(mockFn).toHaveBeenCalled() 来验证函数是否被调用。但是，当我们需要 mock 一个类时，就会遇到一些问题。特别是当这个类有子类时，mock 的方式就不够直接了。例如，考虑以下的代码：
// www.javascriptcn.com code example
class Parent {
method() {
console.log("Parent method");
}
}
class Child extends Parent {
method() {
console.log("Child method");
}
}
function testFn(obj) {
obj.method();
}
test("testFn", () => {
const mockObj = {
method: jest.fn(),
};
testFn(mockObj);
expect(mockObj.method).toHaveBeenCalled();
});这段代码定义了一个 Parent 类和一个 Child 类，其中 Child 继承自 Parent。然后定义了一个 testFn 函数，它接受一个对象参数 obj，调用 obj.method() 方法。最后，使用 Jest 进行测试，通过创建一个 mock 对象 mockObj，将其传递给 testFn，然后验证 mockObj.method 是否被调用。
但是，这段代码存在一个问题，即无法 mock Child 类的 method 方法。因为当我们在创建 mockObj 对象时，无法直接指定其类型为 Child，而是只能指定其类型为一个普通的对象。因此，当 testFn 调用 obj.method() 时，实际上调用的是 Parent 类的 method 方法，而不是 Child 类的 method 方法。
解决方式
为了解决上述问题，我们需要使用 Jest 提供的一些高级 mock 技术。具体来说，我们可以使用 jest.mock() 方法来 mock 类，然后使用 jest.fn() 方法来 mock 类的方法。
例如，我们可以修改上述代码如下：
// www.javascriptcn.com code example
class Parent {
method() {
console.log("Parent method");
}
}
class Child extends Parent {
method() {
console.log("Child method");
}
}
function testFn(obj) {
obj.method();
}
jest.mock("./parent", () => {
return {
Child: jest.fn().mockImplementation(() => {
return {
method: jest.fn(),
};
}),
};
});
test("testFn", () => {
const mockObj = new Child();
testFn(mockObj);
expect(mockObj.method).toHaveBeenCalled();
});这段代码首先定义了 Parent 类和 Child 类，然后定义了 testFn 函数和测试用例。在测试用例中，我们使用 jest.mock() 方法来 mock Parent 类，将其替换为一个对象，该对象包含一个 Child 属性，该属性是一个 mock 类。然后，我们使用 jest.fn() 方法来 mock Child 类的 method 方法。最后，我们创建一个 Child 类的实例 mockObj，并将其传递给 testFn 函数，然后验证 mockObj.method 是否被调用。
通过上述方式，我们成功地 mock 了 Child 类的 method 方法，而不是 Parent 类的 method 方法。
指导意义
Jest 是一款强大的 JavaScript 测试框架，它提供了丰富的测试工具和 API，方便开发者编写和运行测试用例。在使用 Jest 进行测试时，mock 是一个常用的技术手段，它可以模拟各种场景，使得测试更加全面和可控。但是，在使用 mock 时，有时会遇到一些子类相关的问题，需要使用 Jest 提供的高级 mock 技术来解决。
因此，开发者需要掌握 Jest 的基本使用方法和高级 mock 技术，以便更好地进行测试。同时，开发者还需要了解面向对象编程的相关知识，特别是类和继承的概念，以便更好地理解和解决子类相关的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d0df42a941bf71341d131c