Fark ne?
Örneğinizde gördüğünüz gibi, temel fark kaynak kodun okunabilirliğini artırmaktır. Örneğinizde yalnızca iki işlev var, ancak bir düzine işlev olup olmadığını düşünün. o zaman şöyle gidecek
function1().function2().function3().function4()
Gerçekten çirkinleşiyor ve okumak zor oluyor, özellikle fonksiyonların içini doldururken. Bunun da ötesinde, Visual Studio kodu gibi belirli düzenleyiciler 140'tan fazla satır uzunluğuna izin vermez. ama takip etmek gibi giderse.
Observable.pipe(
function1(),
function2(),
function3(),
function4()
)
Bu, okunabilirliği büyük ölçüde artırır.
Fark yoksa, neden borusu işlev var?
PIPE () işlevinin amacı, alan ve gözlemlenebilir olan tüm işlevleri bir araya toplamaktır. Başlangıçta bir gözlemlenebilirlik alır, daha sonra bu gözlemlenebilir, onun içinde kullanılan her fonksiyon tarafından pipe () fonksiyonu boyunca kullanılır.
İlk fonksiyon gözlemlenebilir olanı alır, işler, değerini değiştirir ve bir sonraki fonksiyona geçer, ardından bir sonraki fonksiyon ilk fonksiyonun gözlemlenebilir çıktısını alır, işler ve bir sonraki fonksiyona geçer, sonra tüm fonksiyonlara kadar devam eder. pipe () işlevinin içi gözlemlenebilir olanı kullanın, sonunda işlenmiş gözlemlenebilirliğe sahip olursunuz. Sonunda, değeri çıkarmak için gözlemlenebilir olanı subscribe () işlevi ile çalıştırabilirsiniz. Unutmayın, orijinal gözlemlenebilirdeki değerler değişmez. !!
Neden bu işlevler farklı ithalata ihtiyaç duyuyor?
İçe aktarma, işlevin rxjs paketinde nerede belirtildiğine bağlıdır. Bu böyle devam ediyor. Tüm modüller, Angular'daki node_modules klasöründe saklanır. {class} öğesini "modül" den içe aktar;
Aşağıdaki kodu örnek olarak alalım. Bunu stackblitz'e yazdım. Böylece hiçbir şey otomatik olarak oluşturulmaz veya başka bir yerden kopyalanmaz. Gidip okuyabileceğiniz zaman rxjs belgelerinde belirtilenleri kopyalamanın anlamını görmüyorum. Bu soruyu burada sorduğunuzu varsayıyorum, çünkü belgeleri anlamadınız.
- İlgili modüllerden içe aktarılan harita, gözlemlenebilir boru sınıfları vardır.
- Sınıfın gövdesinde, kodda görüldüğü gibi Pipe () işlevini kullandım.
Of () işlevi, abone olduğunda sırayla sayılar yayınlayan bir gözlemlenebilir döndürür.
Observable henüz abone değil.
Bunu kullandığınızda Observable.pipe () gibi, pipe () işlevi verilen Observable'ı girdi olarak kullanır.
İlk işlev olan map () işlevi, Gözlemlenebilir, işleyin, işlenen Gözlemlenebilir'i pipe () işlevine geri döndürür
daha sonra işlenen Gözlemlenebilir, varsa sonraki işleve verilir,
ve tüm işlevler Gözlemlenebilir'i işleyene kadar böyle devam eder,
sonunda Observable, pipe () işlevi tarafından bir değişkene döndürülür, aşağıdaki örnekte gözlemlenir.
Şimdi Observable'daki şey şudur: Gözlemci abone olmadığı sürece herhangi bir değer yaymaz. Bu yüzden bu Observable'a abone olmak için subscribe () işlevini kullandım, ardından abone olur olmaz abone oldum. Of () işlevi değerleri yaymaya başlar, ardından pipe () işlevi aracılığıyla işlenir ve sonunda nihai sonucu alırsınız, örneğin () işlevinden 1 alınır, map () işlevine 1 eklenir, ve geri döndü. Bu değeri, abone (işlev ( bağımsız değişken ) {}) işlevinin içinde bir bağımsız değişken olarak elde edebilirsiniz .
Yazdırmak istiyorsanız, o zaman
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()operatörleri geçmenize izin veriyor mu ?