Яка різниця?
Як ви бачите у своєму прикладі, головна відмінність полягає в покращенні читабельності вихідного коду. У вашому прикладі є лише дві функції, але уявіть, чи існує десяток функцій? то піде як
function1().function2().function3().function4()
це справді стає потворним і важким для читання, особливо коли ви заповнюєте всередині функцій. Крім того, деякі редактори, такі як код Visual Studio, не дозволяють довжину більше 140 рядків. але якщо це буде наступним чином.
Observable.pipe(
function1(),
function2(),
function3(),
function4()
)
Це різко покращує читабельність.
Якщо різниці немає, чому функціональна труба існує?
Призначення функції PIPE () полягає в об'єднанні всіх функцій, які приймають і повертають спостережувані. Спочатку потрібно спостережуване, а потім це спостережуване використовується у всій функції pipe () кожною функцією, яка використовується всередині нього.
Перша функція приймає спостережуване, обробляє його, модифікує його значення і переходить до наступної функції, потім наступна функція бере вихідний спостережуваний першої функції, обробляє його і переходить до наступної функції, потім вона продовжується, поки всі функції всередині функції pipe () використовуйте це спостережуване, нарешті, у вас є оброблене спостережуване. В кінці ви можете виконати спостережливу функцію subscribe (), щоб витягти з неї значення. Пам'ятайте, значення в оригіналі спостережуваних не змінюються. !!
Чому ці функції потребують різного імпорту?
Імпорт залежить від того, де функція вказана в пакеті rxjs. Це проходить так. Всі модулі зберігаються в папці node_modules в Angular. імпортувати {class} з "модуля";
Візьмемо наступний код як приклад. Я щойно писав це у стекбліці. Отже, ніщо автоматично не генерується і не копіюється звідкись ще. Я не бачу сенсу копіювати те, що зазначено в документації rxjs, коли ви також можете це прочитати. Я припускаю, що ви задали це питання тут, тому що не розуміли документації.
- Є конвеєрні, спостережувані, класи класів карт, імпортовані з відповідних модулів.
- В тілі класу я використовував функцію Pipe (), як показано в коді.
Функція Of () повертає спостережуване, яке випускає цифри послідовно, коли воно передплачене.
На спостережну ще не підписані.
Коли ви використовували його, подобається Observable.pipe (), функція pipe () використовує даний Observable як вхід.
Перша функція map () використовує функцію Observable, обробляє її, повертає оброблений Observable назад у функцію pipe (),
тоді цей оброблений Observable надається наступній функції, якщо вона є,
і це триває так, поки всі функції не обробляють Observable,
в кінці того, що Observable повертається функцією pipe () до змінної, у наступному прикладі її obs.
Зараз справа в Observable полягає в тому, що поки спостерігач не підписався, він не видає жодного значення. Тож я використав функцію subscribe (), щоб підписатись на цей Observable, і як тільки я його підписав. Функція () починає випускати значення, потім вони обробляються через функцію pipe (), і ви отримуєте кінцевий результат в кінці, наприклад 1 береться з функції (), 1 додається 1 у функцію map () і повернувся назад. Ви можете отримати це значення як аргумент усередині функції 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()дозволяє вам передавати створені вами оператори?