JavaScript Academy · Lezione

Aprire un database

Crei database e object store.

Aprire un database è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.

Che cos'è IndexedDB?

IndexedDB è un database transazionale integrato nel browser, con grande capacità. A differenza di localStorage (di dimensioni ridotte, con sole stringhe e sincrono), memorizza oggetti strutturati, supporta gli indici e funziona in modo asincrono.

Apertura di un database

È possibile aprire o creare un database con indexedDB.open(name, version). Il metodo restituisce un oggetto richiesta, i cui eventi indicano l'esito positivo o negativo dell'operazione.

const request = indexedDB.open('notes-db', 1);

Gli eventi della richiesta

Una richiesta di apertura genera eventi che è possibile gestire:

onsuccess — il database è pronto
onerror — apertura non riuscita
onupgradeneeded — lo schema deve essere creato o aggiornato

request.onsuccess = (e) => {
  const db = e.target.result;
  console.log('database opened');
};
request.onerror = (e) => {
  console.log('open failed:', e.target.error);
};

onupgradeneeded

onupgradeneeded viene eseguito quando il database viene creato per la prima volta o il numero di versione aumenta. Questo è l'unico punto in cui è possibile modificare lo schema (creare o eliminare archivi di oggetti e indici).

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  // create object stores here
};

Archivi di oggetti

Un archivio di oggetti è simile a una tabella: un contenitore di record. Lo crei con db.createObjectStore(name, options) all'interno di onupgradeneeded.

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  db.createObjectStore('notes', { keyPath: 'id' });
};

Il keyPath

keyPath indica a IndexedDB quale proprietà di ogni oggetto costituisce la chiave primaria. Gli oggetti memorizzati devono avere tale proprietà e le chiavi devono essere univoche.

db.createObjectStore('users', { keyPath: 'email' });
// Each stored user object must have a unique 'email'.

Chiavi autoincrementali

Se gli oggetti non hanno una chiave naturale, lasci che IndexedDB ne generi una con autoIncrement: true. Ogni nuovo record riceve l'intero successivo.

db.createObjectStore('logs', {
  keyPath: 'id',
  autoIncrement: true
});
// id is assigned automatically on add().

Verifica degli archivi esistenti

Poiché onupgradeneeded viene eseguito a ogni incremento di versione, protegga la creazione con db.objectStoreNames.contains per evitare errori nelle esecuzioni successive.

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  if (!db.objectStoreNames.contains('notes')) {
    db.createObjectStore('notes', { keyPath: 'id' });
  }
};

Conservazione del riferimento a db

Salvi l'oggetto database da onsuccess affinché le operazioni successive possano usarlo. Tutte le letture e le scritture passano attraverso questa istanza di db.

let db;
request.onsuccess = (e) => {
  db = e.target.result; // reuse for transactions
};

Gestione delle aperture bloccate

Se un'altra scheda mantiene aperta una versione precedente, un aggiornamento potrebbe essere blocked. Ascolti onblocked e chieda all'utente di chiudere le altre schede.

request.onblocked = () => {
  console.log('Close other tabs to upgrade the database.');
};

Flusso di apertura

Per aprire IndexedDB, chiami open con un nome e una versione, crei lo schema in onupgradeneeded, quindi recuperi il db in onsuccess. Da quel momento può eseguire transazioni per leggere e scrivere dati.

Verifica rapida

Verifichi la Sua comprensione dell'apertura di un database.

Riepilogo

Ha imparato ad aprire un database IndexedDB:

indexedDB.open(name, version) restituisce una richiesta.
Crei gli archivi di oggetti esclusivamente in onupgradeneeded.
keyPath imposta la chiave primaria; autoIncrement genera le chiavi.
Salvi il db da onsuccess per usarlo in seguito.
Gestisca onerror e onblocked.

Prossimo argomento: transazioni e operazioni CRUD.

Domande Frequenti

La lezione «Aprire un database» è gratuita?

Sì — il testo completo di «Aprire un database» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.

Cosa imparerò in «Aprire un database»?

Crei database e object store. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare JavaScript Academy?

Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.

Quanto tempo richiede la lezione «Aprire un database»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?

Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

← Torna a JavaScript Academy