Immagino che ti sia imbattuto negli operatori RxJS come: switchMap, exhaustMap, concatMap e mergeMap (i cosiddetti operatori di ordine superiore). La convinzione comune che devi restituire un osservabile interno da una funzione di callback passata agli operatori sopra menzionati è vera solo per metà o più precisamente per un quarto. Infatti, il tipo restituito della funzione di mappatura , fornita agli operatori di ordine superiore, deve essere di tipo ObservableInput :

Come puoi vedere, restituire un Osservabile è solo una delle quattro possibilità . In questo post del blog, presenterò semplici esempi con l' operatore switchMap con diversi tipi di ritorno conformi a ObservableInput.

Sottoscrivibile

L' interfaccia Sottoscrivibile è implementata dalla classe Observable , quindi la sua istanza ha un tipo compatibile:

Nell'esempio precedente, viene restituito un osservabile dalla funzione di callback passata all'operatore switchMap. È un modello molto comune e ampiamente noto nelle applicazioni angolari con servizi che dipendono dal servizio HttpClient .

Promettere

Se utilizzi la libreria RxJS al di fuori dell'ecosistema Angular, è probabile che tu faccia richieste http con l'aiuto dell'API Fetch o di qualche libreria di terze parti con API basata su Promise (ad es . Axios ). È perfettamente valido restituire una promessa dalla funzione di mappatura senza la necessità di analizzarla esplicitamente in un osservabile usando la funzione from :

Come una matrice

Gli oggetti con una proprietà length ed elementi indicizzati sono chiamati array-like (ad esempio la variabile arguments o un'istanza NodeList ). Puoi convertirli in una normale istanza Array con l'aiuto del metodo statico Array.from . Tuttavia, gli operatori di ordine superiore sono in grado di operare direttamente su tali oggetti:

Iterabile

Ci sono diversi iterabili incorporati in JavaScript, vale a dire: Array, String, Map e Set .

Vettore

Ho acquisito familiarità con il tipo ObservableInput quando mi sono imbattuto nella restituzione di una serie di azioni dall'effetto splitter :

Pertanto, se devi inviare più di un'azione in risposta all'azione ricevuta , puoi semplicemente restituire un array contenente gli elementi richiesti che verranno inviati allo stream .

Corda

Il flusso risultante emette le lettere stringa come valori successivi:

Carta geografica

Le voci della mappa sono emesse nell'osservabile:

Impostare

Gli elementi unici del set diventano i valori del flusso risultante:

Conclusioni

Vale sempre la pena dare una breve occhiata alla documentazione ufficiale quando inizi a utilizzare una nuova libreria. Probabilmente restituirai un osservabile dalle funzioni di callback degli operatori di ordine superiore per la maggior parte del tempo, tuttavia, dovresti tenere presente che il tipo restituito effettivo richiesto è ObservableInput.

Esempio dal vivo:

Spero che il post ti sia piaciuto e che tu abbia imparato qualcosa di nuovo . Se è così, per favore, fammi un applauso