Per restare in tema di supereroi, Javascript è la tuta meccanica di Tony Stark (Iron Man, per intenderci).

Esso infatti permettere di estendere le funzionalità delle tue pagine in modi impossibili da raggiungere usando solo HTML e CSS.

Puoi includerlo nella stessa pagina tramite i tag <script></script>, all'interno dell'head.

<!doctype html>
<html> 
	<head> 
		<title>Titolo del documento</title> 
		<script>
               window.onload = function(){
                   alert( "FUNZIONO!");
               }
           </script>
	</head> 
	<body> 
	</body> 
</html>

o usare un file esterno, cos�:

<script src="ilmioscript.js"></script>

con il file esterno che contiene:

// Ilmioscript.js
window.onload = function(){
    alert( "FUNZIONO!");
}

Da sviluppatore, il mio consiglio � di usare sempre file esterni, anche se per ora non � di fondamentale importanza.

Una variabile è un contenitore di valori. Immagina di avere diversi salumi sparsi in giro per il frigorifero. Un bel casino vero? Proprio per questo, molto probabilmente deciderai di mettere i suddetti in un contenitore comune, per aumentare l’ordine all’interno del frigorifero. Prendiamo l’esempio qui sotto:

var due = 8 - 6;

come puoi vedere, oltre al concetto anche la sintassi è estremamente semplice. Il tutto inizia con la dichiarazione “var”, che fa capire al linguaggio che quello che si scriverà da lì al prossimo punto e virgola farà parte di una variabile. In seguito, si assegna un nome alla variabile stessa (nel nostro caso questo nome è “due”) e le si assegna il valore desiderato grazie ad un ugaglianza, data dal simbolo “=”.

Immaginiamo di voler dichiarare più variabili, potremmo farlo nel seguente modo: 

var uno = 3 - 2;
var due = 4 - 2;
var tre = 12 - 9;

questo è senz’altro uno dei modi più sicuri per dichiarare una serie di variabili, in quanto se vogliamo aggiungere una variabile di cui ci siamo dimenticati possiamo farlo in tutta sicurezza. Tuttavia esiste un altro modo, molto più comodo, per dichiarare più variabili senza dover riscrivere ogni volta il fastidioso “var”:

var uno = 3 - 2,
	due = 4 - 2,
	tre = 12 - 9;

come possiamo notare, la dichiarazione della variabile viene fatta solo all�inizio, e dopo il primo valore, invece di aggiungere un punto e virgola e riscrivere nuovamente il �var�, si aggiunge una virgola e si continua direttamente a scrivere i nomi delle prossime variabili che vogliamo istanziare. Il punto e virgola, con questo metodo, si aggiunge solo alla fine dell�ultima variabile.

Fai attenzione con i nomi

Nell’ambito della programmazione in genere non si utilizzano dei numeri nei nomi delle variabili, tuttavia è bene sapere che in Javascript il nome di una variabile non può MAI iniziare con un numero, se proprio vuoi utilizzare un carattere speciale, quello dovrà essere l’underscore (“_”).

Un array è un contenitore di due o più valori. Se ti ricordi cosa ho detto sulle variabili, le ho definite quasi nello stesso modo. Questo perchè possiamo trattare un array proprio come una variabile: 

var auto = 'fiat'; //Questa è una variabile
var autoArray = ['fiat', 'bmw', 'general motors']; //Questo è un array

Le uniche differenze evidenti tra una variabile ed un array sono l’aggiunta delle parentesi quadre all’inizio e la fine di quest’ultimo e il fatto di contenere valori multipli, separati tra loro da una virgola.

Naturalmente, sarebbe più che difficile gestire questi dati in un sol colpo, ecco perchè Javascript ci permette di manipolare a nostro piacimento gli array, anche se prima bisogna capire come gli array funzionano esattamente.

Per selezionare un elemento, bisogna tener conto che Javascript usa un indice a base zero, ciò significa che per selezionare gli elementi dovremmo scrivere una cosa del genere:

autoArray[0] = 'alfa romeo';
//Sostituiamo il primo elemento, nel nostro caso 'fiat', con 'alfa romeo'
autoArray[1] = 'ferrari';
//Sostituiamo il secondo elemento, nel nostro caso 'bmw', con 'ferrari'

Javascript ci fornisce inoltre metodi nativi per modificare gli elementi senza troppa fatica. Vediamone alcuni:

autoArray.splice(1, 1);
/*Cancelliamo 'bmw' dall'array. 
Il primo numero dentro 'splice' serve ad indicare la posizione dell'elemento,
mentre il successivo serve a specificare il numero degli elementi che vogliamo rimuovere */

autoArray.pop();
/*Cancelliamo l'ultimo elemento dall'array, nel nostro caso 'general motors'*/

autoArray.push('pagani');
//Inserisce l'elemento 'pagani' all'inizo dell'array

Naturalmente non ci sono solo questi tre metodi per manipolare un array. Per una lista completa, ti consiglio vivamente la visione di questa pagina di W3school; l’unico requisito richiesto è quello di masticare un po’ l’inglese.

Scopri ora come creare un sito dinamico con Typo3

Vivi la prossima sfida