rx-sandbox 是一个基于 RxJS 的工具，它可以让我们更方便地在浏览器中测试 RxJS 的代码。本篇文章将为大家介绍如何使用 rx-sandbox 进行前端开发。
简介
rx-sandbox 是一个开源的 RxJS 调试工具，适用于浏览器环境，提供了一种简单的方式来在线调试并验证 RxJS 的行为。支持在代码编辑器中输入代码，使用 rxjs-marbles 语法书写测试用例，并将测试结果实时映射到代码编辑器的侧边栏中。
安装和使用
安装
使用 npm 进行安装：
npm i rx-sandbox
或者使用 yarn 进行安装：
yarn add rx-sandbox
使用
在文件中引入 rx-sandbox：
import { Sandbox } from 'rx-sandbox';
然后我们可以创建一个 Sandbox 实例：
const sandbox = new Sandbox();
接下来，我们就可以使用 sandbox 实例来运行代码和测试。例如，我们可以使用 sandbox.cold 方法创建一个冷 Observable：
const source$ = sandbox.cold('-a-b-c-d-e-f-|');
我们可以使用 sandbox.expectObservable 方法来验证 Observable 发出的值：
const expected$ = sandbox.expectObservable(source$, '^--b-c-(de)-f-|'); sandbox.expectSubscriptions(source$.subscriptions).toBe('^--------------!');
在测试完成后，我们可以调用 sandbox.flush 方法将测试结果输出到浏览器控制台中：
sandbox.flush();
示例代码
下面是一个简单的 rx-sandbox 示例代码：
-- -------------------- ---- ------- ------ - ------- - ---- ------------- ----- ------- - --- ---------- ----- ------- - ------------------------------- ----- --------- - --------------------------------- ------------------- ---------------------------------------------------------------------------- ----------------展开代码
结论
rx-sandbox 是一个非常好用的 RxJS 调试工具，可以帮助我们更方便地测试和验证 RxJS 的代码。在实际开发中，我们可以使用它来快速测试我们的 Observable，并验证其行为是否符合我们的预期。
参考
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f1bb67a403f2923b035c4ef
