简介
在前端开发中，我们有时需要对函数进行测试。为了方便测试，我们会使用 stub 模式，也就是给一个函数提供一个假的实现，以便我们在测试的时候可以控制函数的输入和输出。但是，手动编写 stub 实现是一件比较繁琐的事情，这时我们就可以使用 npm 包 @types/saywhen 来帮助我们实现 stub。
npm 包 @types/saywhen 提供了一些简单易用的 API，可以帮助我们轻松地创建 stub 实现，同时也支持链式调用来实现更复杂的组合操作。
安装
@types/saywhen 是一个 TypeScript 类型定义包，它包含了 saywhen.js 的类型定义。我们可以通过以下命令来安装它：
npm i @types/saywhen --save-dev
使用
创建一个简单的 stub
首先，我们需要引入所需要的 API：
import { when } from 'saywhen';然后，我们可以使用 when 函数来创建一个简单的 stub。当调用函数时，它会在内部记录一些信息（比如被调用的参数），然后返回一个结果。
下面是一个示例：
const add = (a: number, b: number) => a + b; const addStub = when(add).calledWith(1, 2).thenReturn(10); console.log(addStub(1, 2)); // 输出 10 console.log(addStub(3, 4)); // 输出 7
上面的示例中，我们首先定义了一个 add 函数，然后使用 when 函数创建了一个对 add 函数的 stub。我们指定了该 stub 在接收到参数为 [1, 2] 的调用时，返回值为 10。随后，我们分别调用了这个 stub，可以看到第一次调用返回了我们预期的 10 值，第二次调用则返回了 add 的默认值，即 1+2=3。
在 stub 中调用原始函数
有时候，我们需要在 stub 中调用原始函数。当我们使用 when 函数创建 stub 时，实际上会生成一个函数来代替原始函数，在这个新的函数中我们可以通过调用原始函数来获取它的返回值。
下面是一个示例：
const log = (str: string) => console.log(str);
const logStub = when(log).calledWith('hello').thenCallOriginal();
logStub('hello'); // 输出 hello我们首先定义了一个 log 函数，然后使用 when 函数创建了一个对 log 函数的 stub。该 stub 在接收到参数为 ['hello'] 的调用时，会调用原始函数并直接输出调用的参数。
链式操作
当我们需要进行更复杂的操作时，可以使用链式操作来组合多个 API。
下面是一个示例：
-- -------------------- ---- ------- ----- -------- - ------ ------- -- ------- --------- ----- ------ - -- -- ------ ----- ------------ - -------------- ------------------ ------------------- ----- -------------------- ------------------- -------- ----- ---------- - ------------ ----------------- - ---- ----- ----------------------- --------------------------------- -- -- ------ --- ----------------------------------- -- -- ------ ----- -------------------------- -- -- ---- - ---- --- -------------------------- -- -- -------
上面的示例中，我们首先定义了两个函数 sayHello 和 sayBye，然后使用 when 函数创建了两个对应的 stub。我们对 sayHelloStub 进行了两次 chained 调用，分别表示对参数为 'Tom' 和 'Jerry' 时的不同处理方式。使用 thenReturn API 指定了返回值。对于 sayByeStub，我们只进行了一次 chained 调用，但使用了两次 thenReturn API，分别指定了不同的返回值。最后，分别调用了两个 stub，可以看到它们在不同的参数和情况下，返回了正确的结果。
总结
总之，npm 包 @types/saywhen 提供了方便实用的 API，可以帮助我们轻松地实现 stub 实现。我们可以使用 when 函数来创建简单的 stub，也可以使用链式操作来创建更复杂的 stub。在测试代码中，使用 stub 可以帮助我们方便地控制函数的输入和输出，从而轻松进行一些有趣的测试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedc1d9b5cbfe1ea0611f47