3E e 3I SIA: Array e Local Storage

 ARRAY, VETTORI E VARIABILI INDICIZZATE

(sono la stessa cosa)

In JavaScript, un array è una struttura di dati utilizzata per memorizzare una lista di elementi, che possono essere numeri, stringhe, oggetti o anche altri array. Gli elementi di un array sono memorizzati in una sequenza ordinata e ciascuno è identificato da un indice numerico, che inizia da 0.

Creazione di un Array

Puoi creare un array in diversi modi, ecco i più comuni:

1. Usando parentesi quadre:

   javascript

   let numeri = [1, 2, 3, 4, 5];

   let colori = ['rosso', 'verde', 'blu'];

2. Usando il costruttore `Array`:

  javascript

   let numeri = new Array(1, 2, 3, 4, 5);

Caratteristiche principali di un Array

- Accesso agli elementi: Puoi accedere a un elemento utilizzando il suo indice, ad esempio `numeri[0]` ritornerà `1`.

- Modifica degli elementi: Gli elementi possono essere modificati assegnando un nuovo valore all'indice desiderato, ad esempio `numeri[1] = 10` cambierà il secondo elemento in `10`.

- Proprietà `length`: Fornisce la lunghezza attuale dell'array, ovvero il numero di elementi contenuti.

javascript

  console.log(numeri.length); // Output: 5

- Metodi comuni:

  - `push()`: Aggiunge uno o più elementi alla fine dell'array.

   javascript

    numeri.push(6);

    - pop(): Rimuove l'ultimo elemento dell'array.

    javascript

    numeri.pop();

  - shift(): Rimuove il primo elemento dell'array.

    javascript

    numeri.shift();

  - unshift(): Aggiunge uno o più elementi all'inizio dell'array.

    javascript

    numeri.unshift(0);

  - splice(): Aggiunge/rimuove elementi in una posizione specifica.

    javascript

    numeri.splice(2, 0, 'nuovoElemento'); // Aggiunge 'nuovoElemento' alla posizione 2

 

  - **`slice()`**: Ritorna una copia di una porzione dell'array.

   javascript

    let alcuniNumeri = numeri.slice(1, 3)

LOCALSTORAGE

Il `localStorage` è una funzionalità del Web Storage introdotta con HTML5, e consente alle applicazioni web di memorizzare dati sotto forma di coppie chiave-valore direttamente nel browser dell'utente. I dati salvati nel `localStorage` rimangono disponibili anche dopo che l'utente ha chiuso il browser e riaperto la pagina.

Caratteristiche principali del `localStorage`

1. Persistenza dei dati: A differenza del `sessionStorage`, che memorizza i dati solo per la durata della sessione del browser (finché la scheda non viene chiusa), il `localStorage` conserva i dati indefinitamente, ovvero fino a quando non vengono cancellati manualmente o dal codice.

2. Limite di memoria: Generalmente, i browser moderni offrono 5-10 MB di spazio per dominio, ma il limite può variare.

3. Accesso ai dati: L'accesso ai dati è limitato al dominio da cui proviene la pagina web, evitando che altri siti web possano accedere ai dati memorizzati da un sito.

 Come usare il `localStorage`

Ecco alcuni esempi su come utilizzare il `localStorage`:

- Salvare dati:

  javascript

  localStorage.setItem('chiave', 'valore');

  Ad esempio, puoi memorizzare un nome utente:

  javascript

  localStorage.setItem('username', 'MarioRossi');

- Recuperare dati:

  javascript

  const valore = localStorage.getItem('chiave');

  Ad esempio, puoi recuperare il nome utente memorizzato:

  javascript

  const username = localStorage.getItem('username');

  console.log(username); // Output: MarioRossi

-  Rimuovere dati:

javascript

  localStorage.removeItem('chiave');

  Per rimuovere il nome utente:

 javascript

  localStorage.removeItem('username');

 

- Svuotare il `localStorage`:

  javascript

  localStorage.clear();

  Questo comando rimuove tutti i dati memorizzati nel `localStorage`.

- Verificare se una chiave esiste:

  Non esiste un metodo diretto per verificare l'esistenza di una chiave, ma puoi controllare se `getItem` restituisce `null`:

  javascript

  if (localStorage.getItem('username') !== null) {

    console.log('L\'utente è memorizzato.');

  } else {

    console.log('L\'utente non esiste nel localStorage.');

  }

Il `localStorage` è particolarmente utile per memorizzare preferenze dell'utente, temi, o altri dati che devono persistere oltre le sessioni di navigazione. Tuttavia, non è consigliabile memorizzare dati sensibili come password, poiché possono essere facilmente accessibili tramite gli strumenti per sviluppatori del browser.