RxJS 是一种很流行的 JavaScript 库，它使得异步编程更加容易和优雅。RxJS 定义了一些操作符，其中最常见的两种操作符是 from 和 of。
from 操作符
from 操作符用于把数组、Promise、Iterable、Observable 和其他转换为 Observable。其语法如下：
from<T>(input: ObservableInput<T>, scheduler?: SchedulerLike): Observable<T>
其中，input 是将要转换成 Observable 的数据源，可以是数组、Promise、Iterable、Observable 和其他。scheduler 是一个可选的调度器，用于控制 Observable 如何发出通知。
下面是一些例子：
-- -------------------- ---- ------- -- -------- ---------- ----- --- - --- -- --- ----------------------- -- ------------------ -- -- - - - -- - ------- --- ---------- ----- ------- - ------------------------- --------------------------- -- ------------------ -- -- ----- -- --- -------- --- ---------- ----- -------- - --- ------- -- ---- ---------------------------- -- ------------------ -- -- - - - -- ---- ---------- --- ---------- ----- ---------- - ------------ ------------------------------ -- ------------------ -- -- -----
注意，from 操作符会立即发出所有的值，而不是像 Observable 一样一次只发出一个值。
of 操作符
of 操作符用于创建 Observable 并立即发出值。其语法如下：
of<T>(...args: (SchedulerLike | T)[]): Observable<T>
可以看出，of 操作符支持传入任意个数的参数，其中的每个参数都会被立即发出。
下面是一些例子：
of(1, 2, 3).subscribe(val => console.log(val)); // 输出 1 2 3
of('Hello', 'World').subscribe(val => console.log(val)); // 输出 Hello World需要注意的是，如果只传入一个参数，并且这个参数是数组或 Iterable，那么 of 操作符会把这个参数展开成多个值。例如：
of([1, 2, 3]).subscribe(val => console.log(val)); // 输出 [1, 2, 3] of(...[1, 2, 3]).subscribe(val => console.log(val)); // 输出 1 2 3
操作符的应用
from 和 of 操作符在 RxJS 中的应用非常广泛。其中，from 操作符可以用来将异步操作转换为 Observable，从而可以使用一些常用的操作符（比如 map、filter 等）进行数据处理。而 of 操作符可以用来创建 Observable 并立即发出值，可以用来模拟一些简单的异步操作，或者用来快速创建测试数据。
例如，我们可以使用 from 操作符来获取用户输入的值，并通过 map 操作符将其转换为一个新的值：
import { from } from 'rxjs';
import { map } from 'rxjs/operators';
const inputEl = document.getElementById('input');
const obs$ = from<Event>(inputEl, 'input').pipe(
map(event => (event.target as HTMLInputElement).value)
);这样，我们就可以使用 obs$ 来获取用户输入的值，并进行一些数据处理。
而 of 操作符则可以用来快速创建测试数据。例如，我们可以使用 of 操作符来创建一个简单的 Observable，该 Observable 发出两个数字并完成：
import { of } from 'rxjs';
const obs2$ = of(1, 2);这样，我们就可以使用 obs2$ 来测试某些操作符的行为。
结语
本文介绍了 RxJS 中的两个常见操作符 from 和 of，并且提供了一些详细的介绍和示例代码。希望本文能够帮助读者更好地理解 RxJS 的使用和应用。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/67819afe935627c900e101fc