Jest进阶知识：模拟 ES6 类 - 掌握类的依赖模拟与方法监听技巧

引言

在现代前端开发中，ES6 类（class）是常用的一种面向对象编程方式。在测试类的时候，我们经常需要模拟类的依赖，以避免外部因素对测试结果的影响。Jest 提供了强大的工具来模拟类及其方法，确保测试的高效性和准确性。本文将详细介绍如何在 Jest 中模拟 ES6 类，确保类的依赖和方法在测试中能够高效、准确地运行。

模拟类的依赖

在测试一个模块时，如果该模块依赖了其他类，为了屏蔽其影响，我们需要模拟这些依赖的类。jest.mock 方法可以帮助我们实现这一点。

使用示例

假设我们有一个 ReviewCollector 类，它依赖于 ProductReview 类：

// reviewCollector.ts
import ProductReview from "./productReview";class ReviewCollector {private productList: Map<string, { good: number, total: number }> = new Map();addReview(review: ProductReview) {const productName = review.name;const isGood = review.review.includes("好用");if (!this.productList.has(productName)) {this.productList.set(productName, { good: 0, total: 0 });}const product = this.productList.get(productName)!;product.total++;if (isGood) {product.good++;}}getNumGoodReview(productName: string): number {const product = this.productList.get(productName);return product ? product.good : 0;}
}export default ReviewCollector;

// productReview.ts
class ProductReview {constructor(public name: string, public review: string) {}static showInfo(): string {return "这是一个产品评论";}
}export default ProductReview;

为了测试 ReviewCollector 类，我们需要模拟 ProductReview 类：

import ReviewCollector from "../ts/reviewCollector";
import ProductReview from "../ts/productReview";// 使用 jest.mock 模拟 ProductReview 类
jest.mock("../ts/productReview", () => {return jest.fn().mockImplementation((name: string, review: string) => {return {name,review,};});
});describe("测试 ReviewCollector", () => {let collector: ReviewCollector;beforeEach(() => {collector = new ReviewCollector();});test("能够添加一条评论", () => {const review = new ProductReview("产品A", "好用");collector.addReview(review);// 进行断言测试expect(collector.getNumGoodReview("产品A")).toBe(1);expect(collector["productList"].has("产品A")).toBe(true);});test("能够获取好评数", () => {const review1 = new ProductReview("产品A", "好用");const review2 = new ProductReview("产品A", "一般");const review3 = new ProductReview("产品B", "好用");collector.addReview(review1);collector.addReview(review2);collector.addReview(review3);// 进行断言测试expect(collector.getNumGoodReview("产品A")).toBe(1);expect(collector.getNumGoodReview("产品B")).toBe(1);});
});

在这个示例中，我们使用 jest.mock 模拟了 ProductReview 类，使其返回一个简单的对象，从而避免了外部因素对测试结果的影响。

监听类的方法

有时候，我们需要对类的方法进行监听，以验证这些方法是否被正确调用。jest.spyOn 方法可以帮助我们实现这一点。

使用示例

假设我们想对 ProductReview 类的 getter 方法和静态方法进行监听：

import ProductReview from "../ts/productReview";// 模拟类的 getter
const mockName = jest.spyOn(ProductReview.prototype, "name", "get").mockImplementation(() => "小米手机");
const mockReview = jest.spyOn(ProductReview.prototype, "review", "get").mockImplementation(() => "很好用");// 模拟类的静态方法
const mockStatic = jest.spyOn(ProductReview, "showInfo").mockImplementation(() => "静态方法");test("ProductReview", () => {const p = new ProductReview("", "");const result = ProductReview.showInfo();// 断言expect(mockStatic).toHaveBeenCalled();expect(result).toBe("静态方法");expect(p.name).toBe("小米手机");expect(p.review).toBe("很好用");expect(mockName).toHaveBeenCalled();expect(mockReview).toHaveBeenCalled();
});

在这个示例中，我们使用 jest.spyOn 方法监听了 ProductReview 类的 getter 方法和静态方法，并通过 mockImplementation 重新定义了这些方法的行为。这样可以在测试中验证这些方法是否被正确调用。

总结

在 Jest 中模拟 ES6 类是确保类的依赖和方法在测试中高效、准确运行的关键。通过使用 jest.mock 方法，我们可以模拟类的依赖，避免外部因素对测试结果的影响；通过使用 jest.spyOn 方法，我们可以监听类的方法，验证这些方法是否被正确调用。

具体来说：

• jest.mock 用于模拟类的依赖，帮助我们隔离外部因素对测试结果的影响。
• jest.spyOn 用于监听类的方法，帮助我们验证这些方法是否被正确调用，同时还可以控制所监听的方法的行为。

通过这些工具和方法，我们可以编写全面而准确的测试用例，确保类的可靠性和健壮性。希望本文的介绍和示例能帮助你在实际开发中更好地应用这一强大工具。