Note JavaScript - Università degli Studi di Milano

Introduzione a JavaScript

Applicazioni web

  • Risorse in rete identificabili tramite URL: Le risorse web sono accessibili attraverso indirizzi unici che permettono agli utenti di trovarle e interagire con esse.

  • Pagina statica: Un contenuto fisso è rappresentato da una pagina HTML che non cambia in base all'interazione dell'utente; per esempio, http://www.example.com/biblioteca.html è un collegamento a una pagina statica.

  • Pagina dinamica: Si tratta di una pagina il cui contenuto viene generato in tempo reale, in risposta a richieste particolari; un esempio è http://www.example.com/biblioteca.php, dove il contenuto potrebbe variare a seconda dell'input dell'utente.

  • Applicazione web: Software che viene eseguito tramite tecnologie web e che può interagire con il server per raccogliere e presentare dati; utilizza:

  • Linguaggi di mark-up: per definire la struttura del contenuto (es. HTML per la struttura e CSS per lo stile).

  • Linguaggi di scripting: per aggiungere interattività (es. JavaScript, PHP).

  • Tecnologie client-side e server-side: gestiscono rispettivamente l'elaborazione nel browser dell'utente e sul server.

Linguaggi di Programmazione e Scripting

  • Tipologie di linguaggi:

  • Mark-up: Stabilisce la struttura e la presentazione del contenuto (es. HTML, CSS integrato per la richiesta di stile).

  • Programmazione: Comprende linguaggi come Java e C# che consentono di scrivere sequenze di istruzioni dettagliate per l'elaborazione dei dati (linguaggi “ad alto livello”).

  • Scripting: Consiste nella scrittura di piccoli programmi o script per automatizzare compiti (es. PHP, JavaScript).

Specifiche Linguaggi di Programmazione

  • Alfabeto: Insieme di simboli utilizzati per costruire termini e comandi nel linguaggio (lessico).

  • Sintassi: Le regole grammaticali che determinano come i termini devono essere combinati per formare istruzioni valide.

  • Semantica: Rappresenta il significato delle frasi ben formate nel linguaggio di programmazione; ad esempio, un'istruzione può avere una sintassi corretta ma una semantica sbagliata.

  • Analizzatore Sintattico (Parser): Software che verifica se le frasi nel codice sorgente sono conformi alle regole di sintassi del linguaggio, separando e organizzando i vari componenti del codice.

Approcci alla Traduzione dei Programmi

  • Compilazione: Processo che comporta la traduzione diretta del codice sorgente in linguaggio macchina, producendo un file eseguibile.

  • Interpretazione: Processo che implica la lettura e l'esecuzione del codice sorgente riga per riga, ideale per lo sviluppo rapido e il debug.

  • Approccio misto: Combina compilazione e interpretazione, dove il codice sorgente è trasformato in bytecode, poi interpretato da una macchina virtuale.

Pagine Web Dinamiche

  • Tecnologie:

  • Client-side: Linguaggi come JavaScript e Java Applet consentono l'elaborazione direttamente nel browser dell'utente, permettendo un'interazione più fluida e rapida; utile per dare risposte immediate.

  • Server-side: Linguaggi come PHP, JSP e ASP che elaborano richieste sul server, utile per la generazione di contenuti dinamici basati su input utente o database.

Struttura delle Applicazioni Web

  • Tre livelli logici per lo sviluppo web:

  1. Presentazione: Comprende HTML e CSS, utilizzati per strutturare e stilizzare l'aspetto delle pagine web. La presentazione è fondamentale per l'esperienza utente.

  2. Intermedio: Tecnologie come JavaServlet e PHP gestiscono la logica applicativa, elaborando le richieste e le interazioni degli utenti.

  3. Dati: Comprende l'uso di sistemi di gestione di basi di dati relazionali (RDBMS), nonché formati di dati come XML e JSON per lo scambio di informazioni.

Differenze tra Tecnologie Client-side e Server-side

  • Client-side: Non richiede un server per il caricamento e l'esecuzione di pagine che si aggiornano in modo limitato; l'elaborazione avviene nel browser, il che riduce il carico sul server.

  • Server-side: Necessita di un server per la generazione di pagine che sono autenticamente dinamiche, permettendo l'accesso a dati in tempo reale e la manipolazione di informazioni nel back-end.

Introduzione a JavaScript

  • Linguaggio di scripting principale usato sul lato client, diverso da Java non solo nel nome ma anche nei paradigmi e nelle applicazioni.

  • Esecuzione: Non richiede una fase di compilazione; tipicamente, il codice JavaScript viene interpretato direttamente dal browser, consentendo tempi di sviluppo più rapidi e una minore complessità nei cicli di aggiornamento del codice.

Storia di JavaScript

  • Originariamente creato con il nome LiveScript, è stato rinominato JavaScript nel 1995 da Netscape per sfruttare la popolarità di Java. Da allora, è diventato uno standard per la programmazione web.

  • Standard attuale: ECMAScript 262, che definisce la struttura, le funzionalità e le regole di utilizzo del linguaggio.

Elementi Fondamentali di JavaScript

  • Case-sensitive: Il linguaggio distingue tra maiuscole e minuscole; ad esempio, "ciao" non è equivalente a "Ciao".

  • Due concetti principali:

  • DOM (Document Object Model): Rappresenta gli oggetti e le strutture dei documenti in modo da poter interagire e manipolare facilmente i componenti della pagina web.

  • Eventi: JavaScript è un linguaggio impulsato da eventi, formando risposte interattive agli input degli utenti (ad es.: suClick, suLoad).

Tipi e Variabili in JavaScript

  • Debolmente tipato: Il tipo di variabile è determinato automaticamente al primo assegnamento, permettendo flessibilità ma richiedendo attenzione da parte dello sviluppatore per evitare errori di tipo.

  • Tipi principali:

  • Number: Alloca spazi per interi e decimali, facilitando operazioni numeriche; per esempio, valori come 7 o 7.7.

  • Boolean: Rappresenta stati logici, Vero o Falso, essenziali per il controllo delle condizioni.

  • String: Sequenze di caratteri racchiuse tra virgolette, utilizzate per gestire testi e messaggi.

Dichiarazioni delle Variabili

  • Non sempre è necessaria la keyword var, essendo questa in alcuni contesti nativa nelle moderne versioni di JavaScript; le dichiarazioni locali devono invece usare var per garantire la visibilità delle variabili.

  • È considerata una buona norma inizializzare le variabili prima del loro utilizzo, per migliorare la leggibilità e prevenire errori.

Costanti e Commenti

  • Costanti devono essere dichiarate appositamente; possono essere di tipo number oppure boolean e, una volta assegnato un valore, non possono più essere modificate.

  • Commenti nel codice: Utilizzare // per i commenti su singola riga; per più righe è preferibile /* */, pratico per documentare e chiarire il codice senza influenzarne l'esecuzione.

Operatori in JavaScript

  • Operatori Aritmetici: Utilizzati per eseguire operazioni matematiche, includendo + (somma), - (differenza), * (moltiplicazione), / (divisione), ++ (incremento), -- (decremento).

  • Operatori di confronto: Usati per confrontare variabili, come == (uguaglianza), != (diversità), > (maggiore), < (minore), >= (maggiore uguale), <= (minore uguale).

  • Operatori Booleani: Incorporano logique, utilizzando && (AND), || (OR) per combinare condizioni e determinare l'output.

Istruzioni e Espressioni

  • Le istruzioni possono essere singole o combinate per formare logiche più complesse; è essenziale sapere definire e utilizzare correttamente le condizioni booleane, che possono implicare variabili, operatori di confronto e logici.

Funzioni in JavaScript

  • Le funzioni sono definite tramite la parola chiave function e possono essere passate come parametri ad altre funzioni, potenziando la modularità e la riutilizzabilità del codice.

  • Esempi di definizione di funzione: Consentono di restituire valori, come nel caso di function sum(a,b){ return a+b; } che calcola la somma di due numeri.

Costruzione di Oggetti e Metodi

  • Gli oggetti sono creati attraverso costruttori e rappresentano istanze di entità; i metodi sono funzioni associate a questi oggetti e definiscono il comportamento degli stessi.

Eventi in JavaScript

  • La gestione degli eventi permette l'interazione dell'utente con l'applicazione; gli esempi di gestori includono eventi come onClick per rispondere a clic dell'utente o onLoad per eseguire codice quando una pagina è completamente caricata.

Conclusioni

JavaScript è un linguaggio versatile e multicompito con supporto per scripting, manipolazione del DOM e gestione di eventi, essenziale per la creazione di esperienze web moderne e interattive, e parte integrante di qualsiasi sviluppatore web.