path: root/files/it/web/javascript/reference/statements/var/index.html

---
title: var
slug: Web/JavaScript/Reference/Statements/var
tags:
  - Dichiarazioni
  - Globali
  - JavaScript
  - Locali
  - Valore
  - Variabili
  - funzione
translation_of: Web/JavaScript/Reference/Statements/var
---
<div>{{jsSidebar("Statements")}}</div>

<p>La dichiarazione <strong><code>variabile</code> </strong> dichiara una variabile, opzionalmente inizializzabile ad un valore.</p>

<div>{{EmbedInteractiveExample("pages/js/statement-var.html")}}</div>



<h2 id="Sintassi">Sintassi</h2>

<pre class="syntaxbox">var <em>nomevariabile1 [</em>= <em>valore1] [</em>, <em>nomevariabile2 [</em>= <em>valore2] </em><em>... [</em>, <em>nomevariabileN [</em>= <em>valoreN]]]</em>;</pre>

<dl>
 <dt><code>nomevariabileN</code></dt>
 <dd>Il nome della variabile. Può essere qualunque identificatore legale.</dd>
</dl>

<dl>
 <dt><code>valoreN</code></dt>
 <dd>Valore iniziale della variabile. Può essere qualunque espressione legale. Il valore di default è <em>undefined</em> (non definito).</dd>
</dl>

<h2 id="Descrizione"> Descrizione</h2>

<p>Le dichiarazioni di variabile, ovunque appaiano, sono processate prima dell'esecuzione di qualsiasi codice. L'ambiente di una variabile dichiarata con <code>var</code> è il suo attuale <em>contesto di esecuzione</em>, che è la funzione di chiusura o, per le variabili dichiarate al di fuori di qualsiasi funzione, globale. Se si dichiara nuovamente una variabile JavaScript, il suo valore non sarà perso.</p>

<p>Assegnando un valore a una variabile non dichirata la rende implicitamente globale (diventa una proprietà dell'oggetto) quando viene eseguita. Le differenze fra variabili dichiarate e non dichiarate sono:</p>

<p>1. Le variabili dichiarate sono legate al contesto in cui sono dichiarate. Quelle non dichiarate sono sempre globali.</p>

<pre class="brush: js">function x() {
  y = 1;   // Genera un ReferenceError in strict mode
  var z = 2;
}

x();

console.log(y); // scrive "1" in console
console.log(z); // Genera un ReferenceError: z non è definita fuori dalla funzione x
</pre>

<p>2. Variabili dichiarate sono create prima dell'esecuzione del codice. Variabili non dichiarate non esistono finchè il codice assegnato loro non viene eseguito.</p>

<pre class="brush: js">console.log(a);                // Genera un ReferenceError.
console.log('still going...'); // Non verrà eseguito.</pre>

<pre class="brush: js">var a;
console.log(a);                // scrive in console "undefined" o "" a seconda del browser usato.
console.log('still going...'); // scrive in console "still going...".</pre>

<p>3. Variabili dichiarate diventano una proprietà non configurabile del loro contesto di esecuzione (funzione o globale). Quelle non dichiarate sono configurabili (per esempio, possono essere cancellate).</p>

<pre class="brush: js">var a = 1;
b = 2;

delete this.a; // Genera un TypeError in strict mode. Altrimenti fallisce senza generare messaggi.
delete this.b;

console.log(a, b); // Genera un ReferenceError.
// La proprietà 'b' è stata cancellata e non esiste più.</pre>

<p>A causa di queste tre differenze, il fallimento della dichiarazione di variabile porta molto probabilmente a risultati inaspettati. Pertanto <strong>è raccomandato di dichiarare sempre le variabili, indipendentemente dal loro contesto di appartenenza (funzione o globale).</strong> In ECMAScript 5 <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">strict mode</a>, assegnare una variabile non dichiarata genera un errore.</p>

<h3 id="Hoisting_di_var">Hoisting di var</h3>

<p>Poichè le dichiarazioni di variabile (come le dichiarazioni in generale) sono processate prima dell'esecuzione del codice, dichiararne una in qualsiasi punto del codice è equivalente al dichiararle in cima. Questo significa anche che quella variabile può essere usata prima della dichiarazione. Questo comportamento è chiamato "hoisting" (sollevamento, innalzamento), poichè sembra che la dichiarazione di variabile sia portata in cima alla funzione o al codice globale.</p>

<pre class="brush: js">bla = 2;
var bla;
// ...

// è implicitamente interpretato come:

var bla;
bla = 2;
</pre>

<p>Per questa ragione, è consigliato sempre dichiarare le variabili in cima al loro ambiente (in cima al codice globale o della funzione in cui appaiono) al fine di rendere chiaro quali variabili appartengono alle funzioni (locali) e quali no.</p>

<p>È importante precisare che l'hoisting è applicato alla dichiarazione della variabile, ma non all'inizializzazione del suo valore. Il valore verrà infatti assegnato al raggiungimento della dichiarazione :</p>

<pre class="brush: js">function fai_qualcosa() {
  console.log(bar); // non definito
  var bar = 111;
  console.log(bar); // 111
}

// è implicitamente interpretato come:
function fai_qualcosa() {
  var bar;
  console.log(bar); // non definito
  bar = 111;
  console.log(bar); // 111
}
</pre>

<p> </p>

<h2 id="Esempi">Esempi</h2>

<h3 id="Dichiarare_e_inizializzare_due_variabili">Dichiarare e inizializzare due variabili</h3>

<pre class="brush: js">var a = 0, b = 0;
</pre>

<h3 id="Assegnare_un_singolo_valore_stinga_a_due_variabili">Assegnare un singolo valore stinga a due variabili</h3>

<pre class="brush: js">var a = 'A';
var b = a;

// è come dire:

var a, b = a = 'A';
</pre>

<p>Prestare attenzione all'ordine:</p>

<pre class="brush: js">var x = y, y = 'A';
console.log(x + y); // non definito
</pre>

<p>Qui, <code>x</code> e <code>y</code> sono dichiarate prima dell'esecuzione del codice, gli assegnamenti verranno eseguiti in seguito. Nel momento in cui "<code>x = y</code>" viene valutato, <code>y</code> esiste quindi nessun <code>ReferenceError</code> viene generato e il suo valore risulta essere '<code>undefined</code>' (non definit). Quindi, <code>x</code> è assegnata ad un valore non definito. Ora, ad <code>y</code> è assegnato il valore 'A'. Di conseguenza, dopo la prima riga, <code>x === undefined &amp;&amp; y === 'A'</code>. Da qui il risultato.</p>

<h3 id="Inizializzazione_di_più_variabili">Inizializzazione di più variabili</h3>

<pre class="brush: js">var x = 0;

function f() {
  var x = y = 1; // x è dichiarata localmente. y invece no!
}
f();

console.log(x, y); // Genera un ReferenceError in strict mode (y non è definita). 0, 1 altrimenti.
// In modalità non-strict mode:
// x è la globale come si ci aspettava
// però, y è uscita fuori dalla funzione!</pre>

<h3 id="Globali_implicite_e_ambienti_esterni_alle_funzioni">Globali implicite e ambienti esterni alle funzioni</h3>

<p><span lang="it">Le variabili che sembrano essere globali implicite possono essere riferimenti a variabili nell'ambito di una funzione esterna:</span></p>

<pre class="brush: js">var x = 0;  // x è dichiarata dentro l'ambiente file, poi le è assegnato valore 0

console.log(typeof z); // undefined, poichè z ancora non esiste

function a() { // quando a è chiamata,
  var y = 2;   // y è dichiarata dentro l'ambiente della funzione a, e le è assegnato valore 2

  console.log(x, y);   // 0 2

  function b() {       // quando b è chiamata
    x = 3;  // assegna 3 all'esistente ambiente x, non crea una nuova variabile globale
    y = 4;  // assegna 4 all'esistente esterna y, non crea una nuova variabile globale
    z = 5;  // crea una nuova variabile globale z e le assegna valore 5.
  }         // (Throws a ReferenceError in strict mode.)

  b();     // chiamare b crea z come variabile globale
  console.log(x, y, z);  // 3 4 5
}

a();                   // chiamando a si richiama b
console.log(x, z);     // 3 5
console.log(typeof y); // non definito, perchè y è locale alla funzione a</pre>

<h2 id="Specifiche">Specifiche</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specifica</th>
   <th scope="col">Stato</th>
   <th scope="col">Commento</th>
  </tr>
  <tr>
   <td>{{SpecName('ES1')}}</td>
   <td>{{Spec2('ES1')}}</td>
   <td>Definizione iniziale, implementata in JavaScript 1.0</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-12.2', 'var statement')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-variable-statement', 'variable statement')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-variable-statement', 'variable statement')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilità_Browser">Compatibilità Browser</h2>



<p>{{Compat("javascript.statements.var")}}</p>

<h2 id="Guarda_anche">Guarda anche</h2>

<ul>
 <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/let"><code>let</code></a></li>
 <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const"><code>const</code></a></li>
</ul>