Ciclo for-in con Javascript

Scritto in febbraio 24th . •

Il ciclo for…in di Javascript cicla attraverso gli elementi di un array o attraverso le proprietà di un oggetto.
Sintassi

for (variabile in oggetto)
  {
  codice da eseguire
  }

Nota: Il codice nel corpo del ciclo for … in viene eseguito una volta per ogni elemento / proprietà.
Nota: L’argomento variabile può essere una variabile denominata, un elemento di array, o una proprietà di un oggetto.
Esempio
Utilizzare for…in per ciclare un array:

<html>
<body>

<script type="text/javascript">
var x;
var auto = new Array();
auto[0] = "Saab";
auto[1] = "Volvo";
auto[2] = "BMW";

for (x in auto)
  {
  document.write(auto[x] + "<br />");
  }
</script>

</body>
</html>

Comando break – interruzione di ciclo Javascript

Scritto in febbraio 22nd . •

L’istruzione break interrompe il ciclo a continuare l’esecuzione del codice dell’iterazione successiva del ciclo (se presente).
Esempio:

<html>
<body>
<script type="text/javascript">
var i=0;
for (i=0;i<=10;i++)
  {
  if (i==3)
    {
    break;
    }
  document.write("Il numero è " + i);
  document.write("<br />");
  }
</script>
</body>
</html>

Comando continue

L’istruzione continue interrompe il ciclo corrente e continua con il valore successivo.
Esempio:

<html>
<body>
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++)
  {
  if (i==3)
    {
    continue;
    }
  document.write("Il numero è " + i);
  document.write("<br />");
  }
</script>
</body>
</html>

Ciclo while di Javascript

Scritto in febbraio 19th . •

Un ciclo while esegue un blocco di codice per un numero determinato di volte, o quando una determinata condizione è vera.
Sintassi:

while (var<=valorefinale)
  {
  codice da eseguire
  }

Nota: Il <= potrebbe essere una qualsiasi dichiarazione a confronto.
L’esempio che segue definisce un ciclo che inizia con i = 0.
Il ciclo continuerà a funzionare fino a quando i è inferiore o uguale a 5.
I aumenterà di 1 ogni volta che il ciclo viene eseguito:

<html>
<body>
<script type="text/javascript">
var i=0;
while (i<=5)
  {
  document.write("Il numero è " + i);
  document.write("<br />");
  i++;
  }
</script>
</body>
</html>

Ciclo do…while

Il do … while è una variante del ciclo while.
Questo ciclo eseguirà il blocco di codice una volta, poi si ripete il ciclo finché la condizione specificata è vera.
Sintassi:

do
  {
  codice da eseguire
  }
while (var<=valorefinale);

L’esempio che segue utilizza un do … while.
Il do … while sarà sempre eseguito almeno una volta, anche se la condizione è falsa, perché le istruzioni vengono eseguite prima che la condizione sia verificata:

<html>
<body>
<script type="text/javascript">
var i=0;
do
  {
  document.write("Il numero è " + i);
  document.write("<br />");
  i++;
  }
while (i<=5);
</script>
</body>
</html>

Ciclo for di Javascript

Scritto in dicembre 21st . •

Un ciclo esegue un blocco di codice per un numero determinato di volte, o quando una determinata condizione è vera.
Spesso quando si scrive codice, si vuole eseguire lo stesso blocco di codice più e più volte in una riga.
Invece di aggiungere diverse linee quasi uguali in uno script, possiamo utilizzare un ciclo per eseguire un compito come questo.
In JavaScript, ci sono due diversi tipi di cicli:
for – ciclo un blocco di codice un determinato numero di volte
while – ciclo un blocco di codice mentre una determinata condizione è vera
Il ciclo for viene utilizzato quando si sa in anticipo quante volte lo script deve essere eseguito.
Sintassi:

for (var=valorePartenza;var<=valoreFine;var=var+incremento)
{
codice da eseguire
}

L’esempio che segue definisce un ciclo che inizia con i = 0. Il ciclo continuerà a funzionare fino a quando i è inferiore o uguale a 5. I aumenterà di 1 ogni volta che il ciclo viene eseguito.
Nota: Il parametro di incremento potrebbe anche essere negativo, e la <= potrebbe essere una qualsiasi dichiarazione a confronto.

<html>
<body>
<script type="text/javascript">
var i=0;
for (i=0;i<=5;i++)
{
document.write("Il numero è " + i);
document.write("<br />");
}
</script>
</body>
</html>

Funzioni Javascript

Scritto in dicembre 14th . •

Una funzione sarà eseguita da un evento o da una chiamata alla funzione.
Per permettere al browser di eseguire uno script al caricamento della pagina, è possibile inserire lo script in una funzione.
Una funzione contiene il codice che sarà eseguito da un evento o da una chiamata alla funzione.
Si può chiamare una funzione da qualsiasi punto all’interno di una pagina (o anche da altre pagine, se la funzione è incorporata in un file esterno .js).
Le funzioni possono essere definite sia nella sezione “head” che nella sezione “body” di un documento.
Tuttavia, per assicurare che una funzione sia letta/caricata dal browser prima che venga chiamata, potrebbe essere opportuno inserire le funzioni in sezione.

Come definire una funzione

Sintassi:

function nomeFunzione(var1,var2,...,varX)
{
codice da eseguire
}

I parametri var1, var2, etc sono variabili o valori passati alla funzione. Il { e } definiscono l’inizio e la fine della funzione.
Nota: Una funzione senza parametri deve includere le parentesi () dopo il nome della funzione.
Nota: Non dimenticare l’importanza delle lettere maiuscole in JavaScript!
La parola “function” deve essere scritta in lettere minuscole, altrimenti si verifica un errore JavaScript!
Si noti inoltre che è necessario chiamare una funzione con i capitelli esattamente uguale a quella del nome della funzione.
Esempio:

<html>
<head>
<script type="text/javascript">
function visualizzaMessaggio()
{
alert("Ciao Mondo!");
}
</script>
</head>

<body>
<form>
<input type="button" value="Cliccami!" onclick="visualizzaMessaggio()" />
</form>
</body>
</html>

Se la riga: alert ( “Ciao mondo!”) nell’esempio precedente non era stato messo all’interno di una funzione, sarebbe stata eseguita non appena la linea è stata caricata.
Ora, lo script non viene eseguito prima che un utente prema il pulsante d’ingresso.
La funzione visualizzaMessaggio() verrà eseguita se il pulsante di ingresso è stato cliccato.

L’istruzione return

L’istruzione return viene utilizzata per specificare il valore che viene restituito dalla funzione.
Quindi, per le funzioni che restituiscono un valore è necessario utilizzare l’istruzione return.
L’esempio che segue restituisce il prodotto di due numeri (a, b):

<html>
<head>
<script type="text/javascript">
function prodotto(a,b)
{
return a*b;
}
</script>
</head>

<body>
<script type="text/javascript">
document.write(prodotto(4,3));
</script>

</body>
</html>

La durata di variabili JavaScript

Se si dichiara una variabile all’interno di una funzione, la variabile è accessibile solo all’interno di tale funzione.
Quando si esce dalla funzione, la variabile è distrutta.
Queste variabili sono chiamate variabili locali.
Si possono avere variabili locali con lo stesso nome in diverse funzioni, perché ognuna è riconosciuta solo dalla funzione in cui è dichiarata.
Se si dichiara una variabile fuori da una funzione, tutte le funzioni sulla tua pagina hanno accesso ad esssa.
La durata di queste variabili inizia quando si sono dichiarate e termina quando la pagina viene chiusa.

Javascript caselle alert, conferma e prompt

Scritto in dicembre 12th . •

JavaScript ha tre tipi di finestre di popup: casella di Alert, casella Conferma, e la casella Prompt.

Alert Box

Una finestra di avviso viene spesso utilizzata se si vuole essere sicuri che l’informazione arrivi attraverso l’utente.
Quando una finestra di avviso si apre, l’utente dovrà fare clic su “OK” per procedere.
Sintassi:

alert("esempioTesto");

Esempio:

<html>
<head>
<script type="text/javascript">
function crea_alert()
{
alert("Io sono una casella di alert!");
}
</script>
</head>
<body>

<input type="button" onclick="crea_alert()" value="Visualizza casella alert" />

</body>
</html>

Casella di conferma

La casella di conferma viene spesso utilizzata se si desidera che l’utente deve verificare o accettare qualcosa.
Quando una finestra di conferma si apre, l’utente dovrà fare clic su “OK” o “Annulla” per procedere.
Se l’utente fa clic su “OK”, la casella restituisce true.
Se l’utente fa clic su “Annulla”, la casella restituisce false.
Sintassi:

confirm("esempioTesto");

Esempio:

<html>
<head>
<script type="text/javascript">
function crea_conferma()
{
var r=confirm("Premi un bottone");
if (r==true)
  {
  document.write("Hai premuto OK!");
  }
else
  {
  document.write("Hai premuto Cancella!");
  }
}
</script>
</head>
<body>

<input type="button" onclick="crea_conferma()" value="Visualizza casella di conferma" />

</body>
</html>

Casella di prompt

Una casella/finestra prompt viene spesso utilizzata se si desidera che l’utente inserisca un valore prima di entrare in una pagina.
Quando una finestra prompt si apre, l’utente dovrà fare clic su “OK” o “Annulla” per proseguire dopo aver inserito un valore di input.
Se l’utente fa clic su “OK” la finestra di restituisce il valore di input.
Se l’utente fa clic su “Annulla” alla finestra restituisce null.
Sintassi:

prompt("esempioTesto","valoreStandard");

Esempio:

<html>
<head>
<script type="text/javascript">
function crea_prompt()
{
var nome=prompt("Per favore inserisci il tuo nome","Harry Potter");
if (nome!=null && nome!="")
  {
  document.write("Ciao " + nome + "! Come ti butta?");
  }
}
</script>
</head>
<body>

<input type="button" onclick="crea_prompt()" value="Visualizza casella di prompt" />

</body>
</html>

Come andare a capo in una casella/finestra:

<html>
<head>
<script type="text/javascript">
function crea_alert()
{
alert("Ciao! Questo esempio dimostra come" + '\n' + "andiamo a capo!");
}
</script>
</head>
<body>

<input type="button" onclick="crea_alert()" value="Visualizza casella di alert" />

</body>
</html>

Istruzione switch di Javascript

Scritto in dicembre 11th . •

Utilizzare l’istruzione switch per selezionare uno dei molti blocchi di codice da eseguire.
Sintassi:

switch(n)
{
case 1:
  eseguire codice blocco 1
  break;
case 2:
  eseguire codice blocco 2
  break;
default:
  codice da eseguire se n è diversa dai casi 1 e 2
}

Ecco come funziona:
prima abbiamo una sola espressione n (il più delle volte una variabile), che viene valutata una sola volta.
Il valore dell’espressione viene quindi confrontato con i valori per ciascun caso nella struttura.
Se c’è una corrispondenza, il blocco di codice associato a questo caso viene eseguito.
Il comando break viene utilizzato per impedire l’esecuzione di codice vada automaticamente nel case successivo.
Esempio:

<script type="text/javascript">
//Riceverai una diversa frase in base al
//giorno in questo momento. Nota che Domenica=0,
//Lunedì=1, Martedì=2, ecc.

var d=new Date();
giorno=d.getDay();
switch (giorno)
{
case 5:
  document.write("Finalmente è Venerdì");
  break;
case 6:
  document.write("Super Sabato");
  break;
case 0:
  document.write("Riposo di Domenica");
  break;
default:
  document.write("Sto aspettando questo weekend!");
}
</script>

Logiche condizionali Javascript

Scritto in dicembre 10th . •

Le istruzioni condizionali sono utilizzate per eseguire azioni diverse in base a diverse condizioni.

Istruzioni condizionali

Molto spesso quando si scrive codice, si desidera eseguire diverse azioni a seconda di decisioni diverse.
Per fare questo è possibile utilizzare istruzioni condizionali nel codice.
In JavaScript abbiamo le seguenti istruzioni condizionali:
if – utilizzare questa istruzione per eseguire del codice solo se una condizione specificata è vera
if … else – utilizzare questa istruzione per eseguire del codice, se la condizione è vera e un altro codice se la condizione è falsa
if … else if …. else – utilizzare questa istruzione per selezionare uno dei molti blocchi di codice da eseguire
istruzione switch – utilizzare questa istruzione per selezionare uno dei molti blocchi di codice da eseguire

Istruzione if

Utilizzare l’istruzione if per eseguire del codice solo se una condizione specificata è vera.
Sintassi:

if (condizione)
  {
  codice da eseguire se la condizione è vera
  }

Si noti che se è scritto in lettere minuscole. Utilizzando le lettere maiuscole (IF) genera un errore JavaScript!
Esempio:

<script type="text/javascript">
//Scrivi "Buon Giorno" se
//l'orario è minore di 10

var d=new Date();
var tempo=d.getHours();

if (tempo<10)
  {
  document.write("<b>Buon Giorno</b>");
  }
</script>

Si noti che non c’è l’istruzione else … in questa sintassi.
Dici al browser di eseguire del codice solo se la condizione specificata è vera.

Istruzione if … else

Utilizzare if …. else per eseguire del codice se la condizione è vera e un altro codice se la condizione non è vera.
Sintassi:

if (condizione)
  {
  codice da eseguire se la condizione è vera
  }
else
  {
  codice da eseguire se la condizione è falsa
  }

Esempio:

<script type="text/javascript">
//Se il tempo è minore di 10, scriverai "Buon Giorno".
//Altrimenti scriverai "Buona Giornata".

var d = new Date();
var tempo = d.getHours();

if (tempo < 10)
  {
  document.write("Buon Giorno!");
  }
else
  {
  document.write("Buona Giornata!");
  }
</script>

Istruzione if … else if … else

Utilizzare if …. else if … else per selezionare uno dei diversi blocchi di codice da eseguire.
Sintassi:

if (condizione1)
  {
  codice da eseguire se la condizione1 è vera
  }
else if (condizione2)
  {
  codice da eseguire se la condizione2 è vera
  }
else
  {
  codice da eseguire se le condizioni 1 e 2 non sono vere
  }

Esempio:

<script type="text/javascript">
var d = new Date()
var tempo = d.getHours()
if (tempo<10)
  {
  document.write("<b>Buon Giorno</b>");
  }
else if (tempo>10 && tempo<16)
  {
  document.write("<b>Buona Giornata</b>");
  }
else
  {
  document.write("<b>Ciao Mondo!</b>");
  }
</script>

Altro esempio:

<html>
<body>

<script type="text/javascript">
var r=Math.random();
if (r>0.5)
{
document.write("<a href='http://www.flepstudio.org'>FlepStudio!</a>");
}
else
{
document.write("<a href='http://www.google.com'>Google!</a>");
}
</script>

</body>
</html>

Operatori logici e confronti Javascript

Scritto in dicembre 9th . •

Confronto e operatori logici vengono utilizzati per verificare il vero o falso.

Operatori di confronto

Gli operatori di confronto sono utilizzati nelle dichiarazioni logiche per determinare l’uguaglianza o differenza tra le variabili o valori.
Dato che x = 5, la tabella qui sotto illustra gli operatori di confronto:

Operatore	Descrizione	Esempio
==	è uguale a	x==8 è falso
===	è esattamente uguale a ( valore e tipo )	x===5 è vero x===”5″ è falso
!=	non è uguale	x!=8 è vero
>	è maggiore di	x>8 è falso
<	è minore di	x<8 è vero
>=	è maggiore o uguale di	x>=8 è falso
<=	è minore o uguale di	x<=8 è vero

Come può essere utilizzato

Gli operatori di confronto possono essere utilizzati in istruzioni condizionali per confrontare i valori e adottare misure a seconda del risultato:

if (anni<18) document.write("Troppo giovane");

Operatori logici

Gli operatori logici vengono utilizzati per determinare la logica tra le variabili o valori.
Dato che x = 6 e y = 3, la tabella qui sotto illustra gli operatori logici:

Operatore	Descrizione	Esempio
&&	e	(x < 10 && y > 1) è vero
\|\|	o	(x==5 \|\| y==5) è falso
!	non	!(x==y) è vero

Operatore condizionale

JavaScript contiene anche un operatore condizionale che assegna un valore a una variabile in base a una certa condizione.
Sintassi:

noneVariabile=(condizione)?valore1:valore2

Esempio:

animale=(specie=="OCA")?"Cara oca ":"Cara ";

Se la variabile animale ha il valore di “OCA”, poi alla variabile sarà assegnato il valore “Cara oca”, al resto sarà assegnato “Cara”.

Aggiungere stringhe e numeri Javascript

Scritto in dicembre 8th . •

La regola è: se si aggiunge un numero e una stringa, il risultato sarà una stringa!
Provalo tu stesso:

<html>
<body>

<script type="text/javascript">
x=5+5;
document.write(x);
document.write("<br />");
x="5"+"5";
document.write(x);
document.write("<br />");
x=5+"5";
document.write(x);
document.write("<br />");
x="5"+5;
document.write(x);
document.write("<br />");
</script>

<p>The rule is: If you add a number and a string, the result will be a string.</p>

</body>
</html>

Javascript tutorials

Feed Sottoscrizioni

Categorie

Articoli recenti

Commenti recenti

FlepStudio network

Archivi

Scocciatori

Ciclo for-in con Javascript

Comando break – interruzione di ciclo Javascript

Comando continue

Ciclo while di Javascript

Ciclo do…while

Ciclo for di Javascript

Funzioni Javascript

Come definire una funzione

L’istruzione return

La durata di variabili JavaScript

Javascript caselle alert, conferma e prompt

Alert Box

Casella di conferma

Casella di prompt

Istruzione switch di Javascript

Logiche condizionali Javascript

Istruzioni condizionali

Istruzione if

Istruzione if … else

Istruzione if … else if … else

Operatori logici e confronti Javascript

Operatori di confronto

Come può essere utilizzato

Operatori logici

Operatore condizionale

Aggiungere stringhe e numeri Javascript

Feed Sottoscrizioni

Categorie

Articoli recenti

Commenti recenti

FlepStudio network

Tag

Archivi

Scocciatori

Comando continue

Ciclo do…while

Come definire una funzione

L’istruzione return

La durata di variabili JavaScript

Alert Box

Casella di conferma

Casella di prompt

Istruzioni condizionali

Istruzione if

Istruzione if … else

Istruzione if … else if … else

Operatori di confronto

Come può essere utilizzato

Operatori logici

Operatore condizionale