VirtuaLE

Introduzione a JavaScript

Cos'è JavaScript Asincrono?

JavaScript è un linguaggio di programmazione asincrono, il che significa che può eseguire più operazioni contemporaneamente senza bloccare l'esecuzione del programma principale. Immaginate di essere in cucina: mentre cuocete la pasta (operazione che richiede tempo), potete contemporaneamente preparare il sugo, apparecchiare la tavola e fare altre cose. Non dovete stare fermi ad aspettare che la pasta sia pronta!

Caratteristiche principali:

  • Non bloccante: il codice continua ad eseguirsi anche se alcune operazioni richiedono tempo
  • Event-driven: risponde agli eventi (click, caricamento pagine, richieste di rete)
  • Single-threaded: usa un solo "filo" di esecuzione ma gestisce tutto in modo intelligente

Analisi del Codice HTML/JavaScript

Analizziamo ora il codice che avete fornito:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>La mia prima pagina in JavaScript</h1>

    <script>
        // commento inline
        /*
            commento multiline
        */
        console.log("Hello World");
    </script>
</body>
</html>

Struttura del documento:

  1. Dichiarazione DOCTYPE: <!DOCTYPE html> indica che stiamo usando HTML5

  2. Elemento HTML: contiene tutto il documento con attributo lang="en" per la lingua

  3. Sezione HEAD: contiene i metadati della pagina

    • charset="UTF-8": codifica dei caratteri per supportare caratteri speciali
    • viewport: per la visualizzazione responsive sui dispositivi mobili
    • title: titolo che appare nella scheda del browser

  4. Sezione BODY: contiene il contenuto visibile

    • <h1>: titolo principale della pagina
    • <script>: qui inizia il codice JavaScript

Il codice JavaScript:

// commento inline
/*
    commento multiline
*/
console.log("Hello World");

Spiegazione degli elementi:

  • Commenti:

    • // per commenti su una sola riga
    • /* */ per commenti su più righe
    • I commenti non vengono eseguiti, servono per spiegare il codice

  • console.log():

    • È un comando che stampa un messaggio nella console del browser
    • Per vederlo: tasto F12 → scheda "Console"
    • Molto utile per il debug (trovare errori) e testare il codice

Come funziona l'esecuzione:

  1. Il browser carica la pagina HTML dall'alto verso il basso
  2. Quando arriva al tag <script>, esegue immediatamente il codice JavaScript
  3. console.log("Hello World") stampa il messaggio nella console
  4. L'esecuzione continua (in questo caso termina)

Questo è un esempio base, ma JavaScript può gestire operazioni molto più complesse in modo asincrono, come caricare dati da internet, rispondere ai click degli utenti, o aggiornare parti della pagina senza ricaricarla completamente!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>La mia prima pagina in JavaScript</h1>


    <script>
        // commento inline
        /*
            commento multiline
        */
        console.log("Hello World");
    </script>
</body>
</html>