VALORI E VARIABILI IN JAVASCRIPT

In questa parte introduttiva alcuni concetti vengono ripetuti. È utile fissare bene quelli che sono gli elementi fondamentali del linguaggio. I valori sono unità fondamentali di ogni programma. Per capire cosa è un valore facciamo un esempio culinario. Per realizzare una pietanza abbiamo bisogno di vari ingredienti che opportunamente combinati insieme ci forniscono il piatto desiderato. Allo stesso modo in javascript abbiamo bisogno di tutta una serie di unità informative che sono i valori, senza i valori è come se volessimo preparare quel piatto prelibato ma senza avere a disposizione gli ingredienti.

LE VARIABILI

I valori javascript sono depositati nella memoria del computer e dobbiamo poter accedere a essi quando necessario. Per questa necessità javascript come ogni altro linguaggio di programmazione ci mette a disposizione le variabili. Esse sono un po’ come contenitori di cartoni in cui depositare gli oggetti. Le variabili non contengono il valore, ma sono il riferimento all’informazione che sta in memoria. Supponiamo ad esempio di voler dichiarare una variabile anni. La parola da sola non è sufficiente ma deve essere preceduta da var, let o const. let e const sono state introdotte in ES2015. Dichiariamo la variabile con var.

var anni;

Abbiamo dichiarato una variabile, ossia un riferimento in memoria ad un valore, ma non abbiamo assegnato nulla. Assegniamo 36.

variabili

IDENTIFICATORI

Da questo momento in poi nel nostro programma javascript possiamo accedere quel valore attraverso l’identificatore anni. Facciamo alcuni esempi.

var anni = 36;

let nome = “Marco”;

const professione = “web developer”

Abbiamo dichiarato tre variabili perfettamente valide. Ma è valida anche la seguente istruzione che dichiara una variabile non inizializzata.

var cibo;

let età = 20;

const cognome; //Errore una variabile dichiarata con const dobbiamo assegnare un valore.

const cognome =”Rossi”;

Proviamo a modificare la variabile anni.

anni = 30;

console.log(anni); //stamperà 30, il valore 36 è stato sovrascritto.

nome = “Luigi”;

console.log(nome) //ok stamperà Luigi

Se proviamo a cambiare la variabile cognome dichiarata con const otteniamo un errore, ad una costante non è possibile riassegnare un nuovo valore. Parliamo ora di identificatori. Scrivere la seguente assegnazione: let 32 = “ciao” non è un identificatore valido, per essere valido un identificatore deve iniziare con una lettera, underscore o dollaro, non deve contenere spazi, non deve iniziare con un numero. Il numero non può essere il primo carattere ma può stare all’interno del nome. Javascript è case-sensitive.

let a = 10;

let A = 20;

FACCIAMO ALCUNI ESEMPI CON LE VARIABILI

var x = 15;
var y = 26;
var z = x + y;

In questo altro esempio, x, y e z sono variabili, dichiarate con la parola chiave let:

let x = 15;
let y = 26;
let z = x + y;

Da tutti gli esempi sopra, si ha che:

x memorizza il valore 15

y memorizza il valore  26

z memorizza il valore 41

Dichiara sempre le variabili JavaScript con var o let. La parola chiave var viene utilizzata in tutto il codice JavaScript dal 1995 al 2015.Le parole chiave let e const sono state aggiunte nel 2015. Se vuoi che il tuo codice venga eseguito in un browser meno recente, devi usare var.

QUANDO USARE LA PAROLA CHIAVE CONST

Se il valore del dato cambia, usa let o var. In questo esempio, price1 e price2 sono costanti e total è una variabile:

const price1 = 15;
const price2 = 16;
let total = price1 + price2 +30;

Le due costanti price1 e price2 vengono dichiarate con la parola chiave const. Questi sono valori che non cambiano e non possono essere modificati. Il totale della variabile viene dichiarato con la parola chiave let. Questo è un valore che può essere modificato. Usa const quando devi memorizzare dati che non cambiano durante l’esecuzione del programma, come ad esempio il valore pi greco.

QUALCHE INFORMAZIONE IN PIU’ SUGLI IDENTIFICATORI

Tutte le variabili JavaScript devono essere identificate con nomi univoci. Questi nomi univoci sono chiamati identificatori. Gli identificatori possono essere nomi brevi (come x e y) o nomi più descrittivi (età, somma, volume, totale). Le regole generali per la costruzione di nomi per variabili (identificatori univoci) sono:

  • I nomi possono contenere lettere, cifre, trattini bassi e segni di dollaro.
  • I nomi devono iniziare con una lettera
  • I nomi possono anche iniziare con $ e _
  • I nomi fanno distinzione tra maiuscole e minuscole (x e X sono variabili diverse)
  • Le parole riservate non possono essere utilizzate come nomi

OPERATORE DI ASSEGNAMENTO

In JavaScript, il segno di uguale (=) è un operatore di “assegnamento”, non un operatore “uguale a”. Questo è diverso dall’algebra. Quanto segue non ha senso nell’ algebra:

x = x + 15

In JavaScript, invece, ha perfettamente senso: assegna il valore di x + 15 a x. L’espressione precedente si legge: (Calcola il valore di x + 15 e inserisce il risultato dell’operazione in x. Il valore di x viene incrementato di 15.). L’operatore “uguale a” è scritto come ==.

TIPI DI DATO

Le variabili JavaScript possono contenere numeri come 100 e valori di testo come “Mario Rossi“. Nella programmazione, i valori testuali sono chiamati stringhe. JavaScript può gestire molti tipi di dati, ma per ora basta pensare a numeri e stringhe. I valori testuali sono scritti tra virgolette doppie o singole. I numeri sono scritti senza virgolette, se si mettono tra virgolette, verranno trattati come stringhe di testo.

DICHIARAZIONE DI VARIABILI

La creazione di una variabile in JavaScript è chiamata “dichiarazione”. Si dichiara una variabile con la parola chiave var o let:

let carName;

Dopo la dichiarazione, la variabile non ha un valore (tecnicamente si dice undefined ossia non definita). Per assegnare un valore alla variabile, si utilizza il segno di uguale:

carName = “Volvo”;

Si può anche assegnare un valore alla variabile quando si dichiara:

let carName = “Volvo“;

È una buona pratica di programmazione dichiarare tutte le variabili all’inizio di uno script.

 Si possono dichiarare molte variabili in un’unica istruzione. Si inizia l’istruzione con la parola chiave let e si separano le variabili con una virgola:

let persona = “Mario Rossi“, macchina = “Volvo“, prezzo = 200;

Una dichiarazione può estendersi su più righe:

let persona = “Mario Rossi“,

macchina = “Volvo“,

prezzo 200;

IL VALORE UNDEFINED

Nei programmi per computer, le variabili sono spesso dichiarate senza un valore. Il valore può essere qualcosa che deve essere calcolato o qualcosa che verrà fornito in seguito, come l’input dell’utente. Una variabile dichiarata senza un valore sarà undefined. La variabile carName avrà tale valore dopo l’esecuzione di questa istruzione:

let carName;

Se dichiari nuovamente una variabile JavaScript dichiarata con var, non perderà il suo valore. La variabile carName avrà ancora il valore “Volvo” dopo l’esecuzione di queste istruzioni:

var carName = “Volvo“;
var carName;

mentre non è possibile dichiarare nuovamente una variabile o una constante dichiarata con let o const.

Copy to Clipboard

APPROFONDIMENTO AI

In JavaScript, le variabili sono utilizzate per memorizzare valori e dati che possono essere richiamati, manipolati o utilizzati all’interno di un programma. Sono uno dei concetti fondamentali della programmazione, in quanto permettono di gestire e conservare informazioni in maniera dinamica. Di seguito viene fornita una descrizione dettagliata delle variabili in JavaScript, spiegando i diversi tipi di dichiarazione, la loro portata (scope), e come funzionano i concetti di assegnazione e aggiornamento.

1. Dichiarazione delle variabili

In JavaScript, esistono tre parole chiave principali per dichiarare una variabile: var, let, e const.

a. var

•È il modo tradizionale per dichiarare una variabile in JavaScript (prima dell’introduzione di let e const in ECMAScript 6).

•Le variabili dichiarate con var sono funzionali o globali. Questo significa che, se dichiarate all’interno di una funzione, sono visibili solo all’interno della funzione (scope locale), mentre se dichiarate al di fuori di una funzione, diventano variabili globali.

•Supporta l’hoisting, il che significa che la dichiarazione della variabile viene spostata all’inizio del contesto esecutivo, ma l’inizializzazione no. Questo può portare a comportamenti imprevisti.

Esempio:

var x = 5;
if (true) {
     var x = 10; // Modifica la variabile x globale
}
console.log(x); // Output: 10

b. let

•Introdotto in ECMAScript 6, let permette di dichiarare variabili con uno scope di blocco. Ciò significa che la variabile esiste solo all’interno del blocco {} in cui è stata dichiarata.

•A differenza di var, non supporta l’hoisting nello stesso modo, rendendo il codice più prevedibile.

Esempio:

let x = 5;
if (true) {
    let x = 10; // Variabile diversa, scope di blocco
}
console.log(x); // Output: 5

c. const

•Anche const è stato introdotto in ECMAScript 6. Viene utilizzato per dichiarare variabili che non possono essere riassegnate. La variabile dichiarata con const deve essere inizializzata immediatamente e non può essere aggiornata successivamente.

•Anch’esso è vincolato allo scope di blocco, come let.

•Anche se il riferimento a un oggetto o un array è costante, le proprietà interne possono essere modificate.

const x = 10;
x = 20; // Errore: non si può riassegnare una costante

const obj = { name: “Alice” };
obj.name = “Bob“; // Questo è permesso perché stiamo modificando una proprietà interna dell’oggetto

2. Scope delle variabili

Lo scope (ambito) di una variabile definisce il contesto in cui essa è accessibile.

Global Scope: Una variabile dichiarata al di fuori di tutte le funzioni o blocchi è globale e accessibile da qualsiasi parte del codice.

Function Scope (Scope della funzione): Le variabili dichiarate all’interno di una funzione con var sono accessibili solo all’interno della funzione stessa.

Block Scope (Scope del blocco): Con let e const, una variabile è accessibile solo all’interno del blocco in cui è stata dichiarata (tra {}). Questo include blocchi come cicli for, while, e blocchi condizionali if.

Esempio di block scope:

if (true) {
    let x = 5;
}
console.log(x); // Errore: x non è definita al di fuori del blocco

3. Hoisting

L’hoisting è il comportamento di JavaScript che sposta le dichiarazioni delle variabili (var) e le funzioni in cima al loro contesto di esecuzione. Tuttavia, solo la dichiarazione è spostata in alto, non l’inizializzazione.

Esempio di hoisting con var:

console.log(x); // Output: undefined (non errore)
var x = 5;

Esempio con let:

console.log(y); // Errore: y non è definita
let y = 10;

4. Assegnazione e aggiornamento delle variabili

Una volta dichiarata una variabile, è possibile assegnarle un valore e poi aggiornarlo (eccetto per le costanti const, che non possono essere riassegnate).

Esempio:

let x = 5;
x = 10; // Variabile aggiornata
console.log(x); // Output: 10

Con const, come già detto, una volta assegnato un valore, la variabile non può essere modificata.

5. Tipi di dati associati alle variabili

Le variabili in JavaScript possono contenere diversi tipi di dati:

Numeri (number): es. 42, 3.14

Stringhe (string): es. “Hello, world!”

Booleani (boolean): es. true, false

Array: es. [1, 2, 3]

Oggetti: es. { name: “Alice”, age: 30 }

Null: un valore intenzionalmente vuoto.

Undefined: indica che una variabile è stata dichiarata ma non ha ancora un valore assegnato.

Symbol: un tipo di dato primitivo unico e immutabile introdotto in ECMAScript 6.

6. Regole di denominazione

Le variabili in JavaScript devono seguire alcune regole per quanto riguarda i nomi:

•Devono iniziare con una lettera, un underscore _ o un simbolo del dollaro $.

•Non possono iniziare con un numero.

•I nomi delle variabili sono case-sensitive, il che significa che myVariable e myvariable sono due variabili diverse.

Esempio di nomi validi:

let _var = 1;
let $element = “div“;
let myVariable = 10;

7. Best practices

Usare let o const al posto di var: È considerata una buona pratica moderna usare let per variabili che possono essere riassegnate e const per costanti, perché prevengono problemi dovuti allo scope e all’hosting.

Assegnazione significativa: Dare nomi chiari e descrittivi alle variabili per facilitare la leggibilità del codice.

Minimizzare le variabili globali: Dichiarare troppe variabili globali può creare conflitti e errori difficili da individuare.

Conclusione

Le variabili in JavaScript sono strumenti potenti che consentono di memorizzare e gestire dati all’interno dei programmi. Comprendere come funzionano var, let, e const, insieme a concetti come scope e hoisting, è fondamentale per scrivere codice JavaScript efficiente e privo di errori.

LINK AI POST PRECEDENTI

POST SU HTML

POST SU CSS

IL LINGUAGGIO JAVASCRIPT

LINK AL CODICE SU GITHUB

GITHUB