在前端开发过程中，Jest 和 Jasmine 是非常常用的测试框架。然而，有可能在使用这些框架时会遇到 TypeError：this.spyOn 未定义的错误。这篇文章将会详细讲解这个错误的来源，以及如何修复它。
问题来源
在 Jest 或者 Jasmine 中，我们可以使用 spyOn 方法来创建一个 spy 对象，以便我们可以监视我们所关注的函数的调用情况。然而，如果我们在使用 spyOn 方法时出现了下面这个错误，即 TypeError: this.spyOn is not a function，那么这很可能是因为这个方法是在一个不合适的作用域中使用的。
这个错误通常会出现在我们在使用 ES6 类的时候，而且我们也不一定能够在错误提示中看到直接的错误信息。让我们来看一个常见的错误示例：
// javascriptcn.com 代码示例
class MyClass {
myMethod() {
console.log('MyClass.myMethod has been called');
}
}
describe('MyClass', () => {
it('should call myMethod', () => {
const myClass = new MyClass();
spyOn(myClass, 'myMethod');
myClass.myMethod();
expect(myClass.myMethod).toHaveBeenCalled();
});
});如果我们在使用上述示例时遇到了 TypeError: this.spyOn is not a function 的错误，我们可以先确保我们正确地安装了 Jest 和 Jasmine。如果仍然出现这个错误，那么我们可以尝试修改代码中的作用域。
解决方案
在大多数情况下，解决 this.spyOn 未定义的错误非常简单：我们只需要在 spyOn 方法的前面加上全局对象（通常是 window 或者 global），然后再在方法前面加上对应对象的引用即可。
// javascriptcn.com 代码示例
class MyClass {
myMethod() {
console.log('MyClass.myMethod has been called');
}
}
describe('MyClass', () => {
it('should call myMethod', () => {
const myClass = new MyClass();
window.spyOn(myClass, 'myMethod');
myClass.myMethod();
expect(myClass.myMethod).toHaveBeenCalled();
});
});当然，在某些情况下，可能不太方便使用 window 或者 global 对象。如果我们不希望使用这些对象，那么我们可以使用 Jest 提供的高级特性来修复错误。具体地说，我们可以在 Jest 配置对象中添加一个 globals 属性，然后在该属性中添加我们所需要的全局对象。
{
"globals": {
"spyOn": jest.fn()
}
}最后，如果我们仍然无法解决 this.spyOn 未定义的错误，那么我们可以考虑升级 Jest 或者 Jasmine 版本。有时这些框架会在新版本中解决一些常见的问题。
总结
在本文中，我们详细地讲解了 Jest 和 Jasmine 中的 TypeError: this.spyOn is not a function 错误，以及如何修复它。我们首先解释了这个错误的来源，然后提供了多种修复方案，包括在方法前面添加全局对象、使用 Jest 配置对象等。如果您在使用 Jest 或者 Jasmine 时遇到了类似的问题，希望这篇文章能够为您提供帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/653a40b47d4982a6eb427db6