什么是不同之处?
从您的示例中可以看出,主要区别在于提高源代码的可读性。您的示例中只有两个函数,但是想象一下如果有十几个函数呢?那么它将变成
function1().function2().function3().function4()
这真的很丑陋,阅读起来也很困难,特别是当您填写函数内部时。此外,某些编辑器(如Visual Studio code)不允许超过140行长度。但如果像以下方式那样处理,则:
Observable.pipe(
function1(),
function2(),
function3(),
function4()
)
这显著提高了可读性。
如果没有区别,为什么需要pipe()函数?PIPE()函数的目的是将所有接受和返回observable的函数合并在一起。它最初接受一个observable,然后在其内部使用每个函数使用的observable来执行pipe()函数。第一个函数接收observable,处理它、修改它的值,并将其传递给下一个函数,接着下一个函数接收第一个函数的输出observable,处理它,并传递到下一个函数,以此类推,直到pipe()函数中的所有函数都使用该observable,最终你会得到已处理的observable。最后,你可以使用subscribe()函数执行observable,从中提取出值。请记住,原始observable中的值不会被更改!!
为什么这些函数需要不同的导入?导入取决于函数在rxjs包中的指定位置。它是这样的:所有模块都存储在Angular的node_modules文件夹中。import { class } from "module";
让我们以以下代码为例。我刚刚在stackblitz中编写了它,所以没有自动生成任何内容,也没有从其他地方复制任何内容。当您可以直接阅读文档时,我认为将文档中陈述的内容复制过来没有意义。我假设您在这里提出此问题,是因为您没有理解文档。
- 从各自的模块中导入pipe、observable、of、map类。
- 在类的正文中,我使用了Pipe()函数,如代码所示。
Of()函数返回一个observable,在订阅时按顺序发出数字。
Observable还未被订阅。
当你使用Observable.pipe()时,pipe()函数将给定的Observable作为输入使用。
第一个函数map()使用该Observable进行处理,返回经过处理的Observable回到pipe()函数中,
然后,如果有下一个函数,它会将已处理的Observable传递给下一个函数,并且一直这样进行,直到所有函数都处理了Observable,
最后,pipe()函数将已处理的Observable返回到变量中,在以下示例中为obs。
现在Observable中的事情是,只要观察者没有订阅它,它就不会发出任何值。因此,我使用subscribe()函数订阅此Observable,一旦我订阅了它,of()函数就开始发出值,然后它们通过pipe()函数进行处理,最终你可以得到最终结果。例如,1从of()函数中获取,1在map()函数中加上1并返回。你可以将该值作为参数放入subscribe(function (argument) {})函数中获取。如果要打印它,请使用以下方式:
subscribe( function (argument) {
console.log(argument)
}
)
import { Component, OnInit } from '@angular/core';
import { pipe } from 'rxjs';
import { Observable, of } from 'rxjs';
import { map } from 'rxjs/operators';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
obs = of(1,2,3).pipe(
map(x => x + 1),
);
constructor() { }
ngOnInit(){
this.obs.subscribe(value => console.log(value))
}
}
https://stackblitz.com/edit/angular-ivy-plifkg
pipe()
函数能让你传递自己创建的操作符吗? - zero298