Tempo di lettura: 3 minuti
Il transpilatore Babel ci consente di transpilare , ossia convertire, l’ultima release di ESx in una compatibile con tutti i browser attuali.
Come visto nel precedente tutorial la release ES6 ha aggiunto ottime funzionalità a JavaScript. Purtroppo queste ad oggi non sono ancora del tutto compatibili con browser, più datati, quali possono essere,ad esempio, internet explorer 9 .
Utilizzo del transpilatore Babel
Innanzitutto colleghiamoci al sito di Babel e fate click nel menu su try it out, vi si apre una pagina come in figura sotto:
dove a sinistra scriverete il codice in ES6 ed a destra questo verrà transpilato automaticamente in una versione compatibile. Se fate click nella freccia che vi trovate lateralmente questa espande un menu a tendina dove poter effettuare delle personalizzazioni:
quindi sul menu setting ‘flaggate‘ le voci Evaluate e Line Wrap ,mentre su Presets scegliete il linguaggio da transpilare (nel nostro caso sceglieremo ES2015 che equivale a ES6).
Ora ,che siete pronti, provate a scrivere del codice in ES6 partendo dalle variabili (cosa che vedremo in uno dei prossimi tutorial):
let b = 2; const a = 1;
come avrete notato a destra , ossia nella zona del codice transpilato, ora vi è:
"use strict"; var b = 2; var a = 1;
sia const che let sono state tradotte in var anche se fra le due vi è un sostanziale differenza in quanto la prima non può essere riassegnata mentre la seconda si.
Nel prossimo tutorial vedremo un modo di transpilare il codice in linea e ,quindi offline, mediante il Webpack , ovvero,un Bundle di moduli statici per le moderne applicazioni JavaScript.
Per il momento è tutto, prima di darvi appuntamento con la prossima guida vi ricordo che se volete approfondire i concetti di Angular 7 potete farlo seguendo il mio videocorso “Angular dalla A alla Web App” .
