新手都能看懂的关于rxjs中的of实现原理解析

function of(...args): Observable<number> {
	  const observable = new Observable(test);
	  function test(obser: Observer<number>): void {
	    args.forEach((val) => {
	      obser.next(val);
	    });
	  }
	  return observable;
}

let obser = of(1, 2, 3);

obser.subscribe({
  next: (val) => {
    console.log(val);
  },
});
           

关于Observable的作用

Observable需要传入一个函数1作为参数，函数1需要一个含有next方法的对象2作为参数，而subscribe的作用就是将对象2传递给函数1。那么函数1的执行时机是什么时候呢？不难看出当我们调用subscribe函数时才会执行函数1，所以subscribe的作用是触发函数1并传入一个对象2.

分析rxjs的of

由rxjs中的of返回值可以知道，of返回的是一个observable类型，同时of可以传入一系列的参数，所以我们得在函数1中遍历所有参数并执行next函数。

同理可写出timer的执行过程

function timerself(time): Observable<number> {
	  const observable = new Observable(test);
	  function test(obser: Observer<number>): void {
	    let i = 0;
	    setInterval(() => {
	      obser.next(++i);
	    }, time);
	  }
	  return observable;
}


 let obser = timerself(1000);
 obser.subscribe({
   next: (val) => {
     console.log(val);
   },
 });
           

结论

of内部封装了Observable函数并返回该函数

subscribe函数其实是执行Observable函数所传入的函数，并将自己的参数传入该函数

所以你学会了吗？