Nozioni di base sul JavaScript - parte I

Ciao a tutti!
Con questo tutorial verranno fornite le nozioni di base per comprendere e programmare in Javascript. Il web è popolatissimo di siti contenenti guide sul java scripting, ma generalmente questi tutorials sono indirizzati a chi ha già esperienza in programmazione. Questo tutorial, invece, è indirizzato ai principianti assoluti. Già, hai letto bene, ai principianti assoluti! Se sei mai stato frustrato da tutti quei siti che hanno tutorials per gente che conosce già tutto, o semplicemente ti da scripts da "taglia-ed-incolla" con nessuna spiegazione su come e perchè questi funzionano, allora questo tutorial è per te. Siccome so per esperienza che il miglior sistema per imparare una materia è quello che accompagna l'applicazione pratica alla teoria, si procederà fornendo esempi applicativi per ogni nuovo elemento del linguaggio.

Come per ogni guida che si rispetti, un po di storia.

Come i veterani della navigazione su Internet ricorderanno, il web era una sterile distesa di grige pagine, caricate di enormi immagini, testo Times New Roman, e tutorials su come creare pagine artistiche con l'uso di tabelle. Le pagine sembravano tutte uguali, e c'era poca o nessuna interattivita' con le stesse. La competizione era demandata ai browsers, fu chiaro che il puro HTML aveva raggiunto il suo limite.

Infatti, la massima interattività che un navigatore potesse ottenere era quella di riempire un "order form" e cliccarne il pulsante di conferma. Tutto era azionato da scripts in CGI (Common Gateway Interface) codificati in Perl. Il processo era lento perchè gli scripts CGI dovevano essere eseguiti sul server che ospitava la pagina HTML. Lo script recepiva le informazioni del form e le verificava, quindi generava una risposta a seconda della correttezza delle informazioni.

Per sveltire il processo era necessario un linguaggio che girasse in locale nel browser dell'utente e che potesse leggere e controllare le informazioni dei forms, prima di sottoporle al CGI per il trattamento succesivo. Queste limitazioni, in aggiunta al fatto che gli uternti desideravano più che semplici sfondi e tabelle artistiche, furono i presupposti per la nascita del grande linguaggio.

A quel tempo Netscape stava sviluppando un linguaggio di scripting, chiamato LiveScript, che estendesse le funzionalità dei documenti HTML che andava proprio in quella direzione (siamo agli inizi degli anni '90). Nel Dicembre del 1995, LiveScript divenne JavaScript!

Che cosa è il JavaScript?

Il JavaScript è un linguaggio di scripting che può risiedere in pagine web. Un linguaggio di scripting è un qualsiasi linguaggio per computer che non necessita di essere compilato prima di essere eseguito. Per intenderci, tutti i programmi che lanci nel tuo computer (games, word processors, etc.) sono stati sviluppati in un applicativo che traduce tutti i comandi e le funzioni, che lo sviluppatore ha digitato per creare il programma. L'applicativo l'ha compilanto in un programma che potrà essere eseguito dal tuo PC.

Altro aspetto: il codice JavaScript è interpretato linea per linea quando è richiamato dal web browser. Quando carichi una pagina web, che contiene qualche codice di JavaScript, tu stai eseguendo quel codice in real time nel tuo browser. Lo stesso può interagire con gli eventi che accadono nello stesso browser - image mouseovers, onclick, onload, etc.

Cosa riesce a fare il JavaScript

Sembra ci sia molta confusione su cosa il JavaScript può veramente fare. Ecco una lista di alcune delle potenzialità del JavaScript:

• Generare dinamicamente contenuti HTML e JavaScript (questo può anche essere context sensitive)
• Fare operazioni di DHTML (muovere layers, renderli visibili/invisibili, cambiare contenuto)
• Convalidare informazioni inserite in un modulo (form)
• Fare calcoli
• Generare orologi, calendari, conti alla rovescia, e altre funzioni relative alla data.
• Controllare estensioni, rilevare il tipo di browser
• Eseguire controlli del Browser quali creazioni di finestre, messaggi di attenzione, scroll della finestra...
• Controllo del contenuto - background e cambiamenti del testo, etc.

Cosa non riesce a fare il JavaScript

Nonostante il JavaScript riesca a fare molto, ad alcune cose non è abilitato, tipo:

• Scrivere informazioni sul server
• Lanciare messaggi
• Lanciare databases
• Controllare il tuo intero PC
• Fare messa di data del tuo PC
• Inoculare virus al tuo PC

Creare JavaScripts - tools e tags

I JavaScripts sono facili da creare per l'uso sul web perchè, essendo programmi basati su semplice testo, li puoi creare con qualsiasi editore di testo. Per creare lunghi scripts faciliterebbe il lavoro utilizzare un editor specializzato che offra un sensitivo evidenziatore di linguaggio, oltre a un set di tags già pronti per l'uso. Se non desideri spendere denaro per tale tool, allora WordPad o NotePad va bene lo stesso (quest'ultimo è quello che sto utilizzando in questo momento).

I JavaScripts possono essere posizionati in due locazioni nella pagina HTML. La prima zona dove è possibile inserire uno script è tra i tags <head> and </head> (header) del tuo documento HTML. Questa è la posizione ideale se intendi effettuare operazioni prima del caricamento del contenuto della pagina, o se hai frequenti richiami della/e stessa/e funzione/i dal contenuto del documento. L'altra zona è il corpo del documento (tra <body> e </body>). Questo è la locazione per scripts che devono generare dinamicamente un lancio di HTML o mostrare qualcosa basato su certi valori di funzione, variabili, etc...

Per delimitare uno script in una pagina web, è necessario utilizzare i tags<script> e </script>. Quando il browser incontra questi tags, non visualizza il suo contenuto perchè è riconosciuto come script e, come tale, lo elaborerà. Per cominciare propriamente uno script, avrai bisogno di settare l'inizio del tuo script così: <script language="JavaScript"> o <script language="javascript1.2"> oppure <script type="text/javascript">. Questa impostazione comunica al tuo browser il tipo di script inserito all'interno dei tags.

Non devi sempre avere tutto il codice residente nella pagina HTML. Una cosa simpatica dello JavaScript è che puoi esternare il codice. Cosa significa ciò? Supponiamo che hai un mucchio di pagine che utilizza il medesimo script, sarebbe un vero dolore copiare quello script dentro ogni pagina dove utilizzarlo, specialmente se intendi aggiornare o modificare lo script frequentemente. Il trucco da utilizzare è quello di creare e mettere il file contenente il programma JavaScript in un qualsiasiposto sul tuo server e poi inserire nella pagina HML solo l'indirizzo, il percorso, la locazione dove trovarlo. Ciò è possibile con la proprietà "src" del tag <script>. Ecco un esempio: <script language="javascript" src="http://www.nebulus.org/some_script.js"></script>. Il tag precedente dice al browser: carica lo script chiamato some_script.js che si trova all'indirizzo http://www.nebulus.org/. Adesso quello script sarà parte integrante della pagina web, come il resto del contenuto. Facile, eh?

Ok, chiusa questa veloce ma necessaria parentesi su come includere gli script nelle pagine, nei prossimi capitoli cominceremo veramente a scriverli. Prima, però, ancora alcune avvertenze e consigli.

Controllare i JavaScripts

Sii cosciente che ci saranno volte in cui i tuoi script non funzioneranno. A me succede questo con regolarità. Inserisco caratteri non necessari, o dimentico alcune formattazioni necessarie. Nel caso che i tuoi script abortino, vedrai un messaggio nella status bar (almeno in Netscape) che dice: "JavaScript error: type 'JavaScript:' in location for details". A questo punto devi fare esattamente cosa ti suggerisce il messaggio - digita "JavaScript:" in the location bar, e poi premi Invio (Enter). Vedrai qualcosa di cui parecchia gente non conosce nemmeno l'esistenza: la finestra della Console JavaScript! In questa finestra, vedrai l'errore che lo script ha riscontrato, e su quale linea si trova - simpatico vero! Armato di queste conoscenze, puoi iniziare il controllo dello script, il cosiddetto debug.

Se stai controllando lo script in MSIE, allora otterrai solamente un ambiguo messaggio di attenzione che qualcosa è andato storto e se intendi proseguire comunque con il caricamento della pagina. Per accedere alla finestra di controllo devi fare doppio click sull'icona di attenzione che compare nella status bar. Fare il debug con l' MSIE puo essere doloroso, ma è necessario farlo con ENTRAMBI i browsers, non importa quanto semplice lo script sia.

LIBRI - sono i tuoi amici!

Potresti chiedere, "dove posso reperire maggiori dettagli sul JavaScript?" La risposta è semplice, tapino - leggi un libro specifico. Se non puoi o non vuoi affrontare la spesa di un libro puoi reperire diversi tutorials sulla rete. Basta inserire la giusta keyword in qualsiasi motore di ricerca per ottenere la risposta anche se, a dire il vero, questi tutorials non saranno mai così esaurienti come un buon libro.

Cosa viene adesso?

Adesso che abbiamo coperto le fondamentali informazioni di base, insieme ad alcune tecniche di controllo e la lista del materiale di riferimento, sei veramente pronto per scrivere scripts? Frena un attimo lì.... E' necessario tornare ancora su alcuni concetti e termini di base prima di andare in profondità. Completeremo l'introduzione con un altro capitolo molto importante quindi cominceremo finalmente a codificare qualche script!