1. Introduzione al linguaggio ECMASCRIPT 6

Il PDF di questo articolo è disponibile |QUI|.

Gli esempi di questo articolo sono disponibili |QUI|.

Questo documento fa parte di una serie di quattro articoli:

1. [Introduzione al linguaggio PHP7 attraverso esempi (2019)];
2. [Introduzione al linguaggio ECMAScript 6 attraverso esempi (2019)]. Questo è il documento in questione;
3. [Introduzione al framework VUE.JS attraverso esempi (2019)];
4. [Introduzione al framework NUXT.JS attraverso esempi (2019)];

Si tratta di documenti destinati ai principianti. Gli articoli seguono un ordine logico ma sono vagamente correlati:

• il documento [1] presenta il linguaggio PHP 7. Il lettore interessato solo al linguaggio PHP e non al linguaggio JavaScript degli articoli successivi si fermerà qui;
• i documenti [2-4] mirano a realizzare un client JavaScript per il server di calcolo delle imposte sviluppato nel documento [1];
• i framework JavaScript [vue.js] e [nuxt.js] degli articoli 3 e 4 richiedono la conoscenza del JavaScript delle ultime versioni di ECMASCRIPT, ovvero quelle della versione 6. Il documento [2] è quindi destinato a coloro che non conoscono questa versione di JavaScript. Esso fa riferimento al server di calcolo delle imposte realizzato nel documento [1]. Il lettore di [2] dovrà quindi, in alcuni casi, fare riferimento al documento [1];
• una volta acquisita padronanza di ECMASCRIPT, è possibile affrontare il framework VUE.JS che consente di creare client JavaScript eseguibili in un browser in modalità SPA (Single Page Application). Si tratta del documento [3]. Esso fa riferimento sia al server di calcolo delle imposte realizzato nel documento [1] sia al codice del client JavaScript autonomo realizzato in [2]. Chi legge il documento [3] dovrà quindi, in alcuni casi, fare riferimento ai documenti [1] e [2];
• una volta acquisita padronanza di VUE.JS, è possibile affrontare il framework NUXT.JS che consente di creare client JavaScript eseguibili in un browser in modalità SSR (Server Side Rendered). Esso fa riferimento sia al server di calcolo delle imposte descritto nel documento [1], al codice client JavaScript autonomo realizzato in [2] e all’applicazione [vue.js] sviluppata nel documento [3]. Il lettore di [4] dovrà quindi, in alcuni casi, fare riferimento ai documenti [1], [2] e [3];

L’ultima versione del server di calcolo delle imposte sviluppata nel documento [1] può essere migliorata in vari modi:

• la versione descritta è incentrata sul server. La tendenza attuale (luglio 2019) è quella client/server:
  • il server funziona come servizio jSON;
  • una pagina statica o dinamica costituisce il punto di accesso all’applicazione web. Questa pagina contiene codice HTML /CSS ma anche Javascript;
  • le altre pagine dell’applicazione web vengono generate dinamicamente tramite JavaScript:
    • la pagina HTML può essere ottenuta assemblando frammenti statici, forniti dallo stesso server che ha fornito la pagina iniziale, oppure può essere interamente costruita dal JavaScript;
    • queste diverse pagine visualizzano dati richiesti al servizio jSON;

In questo modo il lavoro viene ripartito tra il client e il server. Il server, così alleggerito, può servire un numero maggiore di utenti.

L’architettura corrispondente a questo modello è la seguente:

JS: JavaScript

Il codice JavaScript è lato client:

• di un servizio di pagine o frammenti, statici o meno;
• da un servizio jSON;

Il codice JavaScript è quindi un client jSON e, in quanto tale, può essere organizzato in livelli [UI, métier, dao] (UI: Interfaccia utente), proprio come i nostri client jSON scritti in PHP. Alla fine, il browser carica una sola pagina, la pagina iniziale. Tutte le altre vengono recuperate e costruite tramite JavaScript. Questo tipo di applicazione è denominata SPA: Single Page Application o anche APU: Applicazione a pagina singola.

Questo tipo di applicazione rientra anche nella categoria delle cosiddette AJAX: Asynchronous JavaScript e XML

• Asynchronous: perché le chiamate del client JavaScript al server jSON sono asincrone;
• XML: poiché XML era la tecnologia utilizzata prima dell’avvento di jSON. Si è tuttavia mantenuto l’acronimo AJAX;

Esamineremo tale architettura nei capitoli successivi. Sul lato client, utilizzeremo il framework JavaScript [Vue.js] [https://vuejs.org/] per scrivere il client JavaScript del server jSON PHP che abbiamo descritto nel documento [1].

[Vue.js] è un framework JavaScript. Per comprenderlo, è necessario padroneggiare questo linguaggio. In questo documento presentiamo lo standard ECMAScript 6, che rappresenta la più recente standardizzazione (nel 2019) di questo linguaggio. La storia e il ruolo di ECMAScript sono disponibili su Wikipedia alla voce [https://fr.wikipedia.org/wiki/ECMAScript].

Il presente documento propone un elenco di script JavaScript da console in diversi ambiti (strutture del linguaggio, accesso ai database, alla rete Internet, programmazione a livelli, programmazione tramite interfacce). Il documento si conclude con due applicazioni:

Un’applicazione da console che fungerà da client del server di calcolo delle imposte realizzato nel documento [1]. Questo client avrà la stessa architettura di quella del client da console PHP realizzato nel documento [1]:

• i livelli [7-9] saranno quelli del client JavaScript in esecuzione in una console;
• i livelli [1-4] sono quelli del server PHP 7 definito nel documento [1];
• a differenza del client da console PHP incorporato nel documento [1], non ci saranno interazioni con il sistema di file locale [6];

Si tratta di un’applicazione client/server in cui il client è un’applicazione da console. Verrà sviluppata una seconda applicazione in cui il codice dei livelli [7-9] verrà portato in un browser. A quel punto saremo pronti ad affrontare i framework JavaScript dei browser nei documenti [3] e [4].

Gli script di questo documento sono commentati e la loro esecuzione in console è riprodotta. Talvolta vengono fornite spiegazioni aggiuntive. Il documento richiede una lettura attiva: per comprendere uno script, è necessario leggere sia il codice, sia i commenti, sia i risultati dell’esecuzione.

L’applicazione server PHP 7 può essere testata |qui|.

Serge Tahé, ottobre 2019