在前端开发中，我们常常需要使用 rxjs 这个强大的库来管理和处理异步事件流。而其中的 observables 模式则是rxjs中最为核心和重要的概念之一。这里，我将介绍一个可以帮助我们更加便捷地使用observables模式的npm包 —— observ-unwrap。
observ-unwrap 是什么？
observ-unwrap是一个提供了便捷的observable unwrap的npm包, 配合rxjs使用, 可以帮助我们轻松地将observable中的值提取出来。
安装 observ-unwrap
使用 npm 命令安装observ-unwrap：
--- ------- -------------
observ-unwrap 使用示例
基本用法
我们可以使用 observ-unwrap 将一个observable解包，并获得observable中的值：
------ - -- - ---- ------- ------ - ------ - ---- ---------------- ----- -------------------- - ------------ ----- ----- - ----------------------------- ------------------- -- ----------
unwrap() 仅仅只是一个简单的函数，它可以将observable转化为摆脱observable特性的非observable的值。
提供默认值
如果 observable 没有发出任何值，或者我们需要提供一些默认值，以避免代码出现异常，我们可以像这样设置：
------ - -- - ---- ------- ------ - ------ - ---- ---------------- ----- ---------------- - --------- ----- ------------ - ------ ------- ----- ----- - ------------------------ -------------- ------------------- -- --------- ------
这种情况下，当 emptyObservable$ 是空的observable。这个时候，unwrap()就会输出'hello world'。
异常情况处理
当 observable 没有发出任何值，并且我们没有设置默认值，则 unwrap() 就会抛出一个异常。 用 try/catch 捕捉此异常可轻松处理此异常。
------ - -- - ---- ------- ------ - ------ - ---- ---------------- ----- ---------------- - --------- --- - ----- ----- - ------------------------- ------------------- -- ------- - ----- ------- - --------------------- -- --------- -- ----- ------- -- ---------- -
处理带有多个值的 observable
如果我们的observable中存在多个值，unwrap()会返回最后一次提取的值。我们可以使用 .take() 操作符来处理。
------ - -- - ---- ------- ------ - ---- - ---- ----------------- ------ - ------ - ---- ---------------- ----- ---------------------------- - ----------- --------- ----- ----- - --------------------------------------------------- ------------------- -- ----------
在 observableWithMultipleValue$中，我们设定了两个值： 'hello' 和 'world'。我们可以使用 take(1) 操作符只提取一次observable，这并没有真正解决问题，但是我们通过此方式确保了解析observable时只获取了一个值。
解析复杂的 observable
我们可以编写observable，使其在符合特定条件时返回不同的值。在这种情况下，我们可能需要一些其他处理以便解析出部分值。
------ - ------------- - ---- -------
------ - ------ - ---- ----------------
----- -------- - -------
----- --------- - --------
----- ---------- - ------------
----- ----------- - ------------
----- ----------- - -------------------------- --------------
----- ------------- - ------- ---- -- -
------ ----- -
---- ---------
------ ---------
---- ----------
------ ---------
--------
------ -----
-
--
----- --------- - ---------------------------------- ----------
----- ---------- - ---------------------------------- -----------
----------------------- -- --- -------
------------------------ -- --- -------在此示例中，我们使用了 combineLatest 创建了一个包含two observables的新observable。此observable每当任何observable发出新值时就会发射新值。
使用 getValueByKey() 函数，我们可以根据一个给定的 “键” 来解析observable的值，最后两个函数调用输出了我们在 leftValue$ 和 rightValue$ observables 中设置的值。
结论
observ-unwrap是一个极其简单但同时也非常有用的npm包，它可极大地提高我们处理及管理observables的效率。如果您在日常开发中经常使用observables模式，我建议您一定要尝试使用它。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066f9d3d1de16d83a66faa