Operatore di pipeline dattiloscritto

Scrivi chiamate di funzioni concatenate in Typescript

È ora di un nuovo operatore

Se stai usando molto le funzioni di Typescript, potresti aver sentito il desiderio di scrivere meglio il tuo codice quando alcune funzioni sono concatenate insieme. Ecco un esempio di cosa intendo con questo.

const scream = (s: string) => s + "!";
const quote = (s: string) => `"${s}"`;
cosnt toUpperCase = (s: string) => s.toUpperCase();

// The first function that executes is
// 'toUpperCase', whose results is proved
// to 'scream', which in turn returns to
// 'quote', which returns the final string
//
// "HELLO WORLD!"
const text = quote(scream(toUpperCase("Hello World")));

Il problema principale è che devi adattare il tuo modello mentale della gerarchia delle chiamate di funzione alle specifiche di Typescript. In particolare, ogni funzione accetta un valore restituito da un'altra funzione come input, il che si traduce in un codice in cui il valore di input originale è posizionato sul bordo destro.

Questo non è affatto un problema. Il codice funziona bene e, una volta che ti sei abituato alla sintassi di un linguaggio di programmazione, tali costrutti iniziano a sembrare naturali.

Cosa fa di diverso l'operatore del gasdotto

Utilizzando il nuovo operatore di pipeline attualmente sperimentale, Typescript consente di scrivere tali chiamate di funzione concatenate da sinistra a destra, dove l'input originale si trova ora sul bordo sinistro.

const scream = (s: string) => s + "!";
const quote = (s: string) => `"${s}"`;
cosnt toUpperCase = (s: string) => s.toUpperCase();

// And here's the new sytanx, starting
// from left and movign throught the 
// call chain to the right.
// 
// It's immediately better to read and
// self explanatory, imho.
"Hello World" |> toUpperCase |> scream |> quote;

La sintassi proposta è molto adatta ai principianti a mio parere, poiché si legge più come il linguaggio umano. Ed evitando le chiamate di funzione annidate, lo stile del codice in generale è più pulito e leggibile.

Passo dopo passo

Al momento della stesura, le cose sono ancora in uno sviluppo molto iniziale. La funzionalità proposta non dovrebbe essere utilizzata in alcun tipo di codice di produzione, ma solo per un piccolo progetto secondario con cui giocare. Per un rapido avvio, Firefox supporta la sintassi in modo nativo dopo aver impostato il flag della funzionalità "--enable-pipeline-operator". C'è anche un plugin babel disponibile.

Ci sono ancora alcune domande aperte, ad esempio come gestire le chiamate di funzioni asincrone in una catena di funzioni utilizzando l'operatore new. Eppure questa funzione sembra molto eccitante, anche se non porterà nuove funzionalità sostanziali. La sintassi proposta sembra davvero buona e non vedo l'ora di aspettare la bozza finale del team di Typescript.