JavaScript Academy · Lektion

Öppna en databas

Skapa databaser och objektlager.

Lektion 1 av 413 steg

Öppna en databas är en gratis lektion i JavaScript Academy på CoddyKit. Detta är lektion 1 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för JavaScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i JavaScript Academy innehåller totalt 4 lektioner.

Vad är IndexedDB?

IndexedDB är en databas med stor kapacitet och stöd för transaktioner som är inbyggd i webbläsaren. Till skillnad från localStorage (liten, endast strängar, synkron) lagrar den strukturerade objekt, stöder index och arbetar asynkront.

Öppna en databas

Du öppnar eller skapar en databas med indexedDB.open(name, version). Det returnerar ett request-objekt vars händelser rapporterar om åtgärden lyckades eller misslyckades.

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

Förfrågningens händelser

En öppningsförfrågan utlöser händelser som du hanterar:

onsuccess — databasen är klar
onerror — öppningen misslyckades
onupgradeneeded — schemat måste skapas eller uppgraderas

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

onupgradeneeded

onupgradeneeded körs när databasen skapas för första gången eller när versionsnumret ökar. Det här är den enda plats där du kan ändra schemat (skapa eller ta bort objektlager och index).

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

Objektlager

Ett objektlager fungerar ungefär som en tabell: en behållare för poster. Skapa ett med db.createObjectStore(name, options) inuti onupgradeneeded.

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

keyPath

keyPath anger vilken egenskap i varje objekt som är dess primärnyckel. Lagrade objekt måste ha den egenskapen, och nycklarna måste vara unika.

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

Automatiskt ökande nycklar

Om objekten saknar en naturlig nyckel kan du låta IndexedDB skapa en med autoIncrement: true. Varje ny post får nästa heltal.

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

Kontrollera befintliga objektlager

Eftersom onupgradeneeded körs vid varje versionsökning bör du villkora skapandet med db.objectStoreNames.contains för att undvika fel när koden körs igen.

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

Spara db-referensen

Spara databasobjektet från onsuccess så att senare operationer kan använda det. Alla läsningar och skrivningar går via denna db-instans.

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

Hantera blockerade databasöppningar

Om en annan flik har en äldre version öppen kan en uppgradering bli blocked. Lyssna efter onblocked och be användaren stänga andra flikar.

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

Öppningsförloppet

Så här öppnar du IndexedDB: anropa open med ett namn och en version, skapa schemat i onupgradeneeded och hämta sedan db i onsuccess. Därefter kör du transaktioner för att läsa och skriva data.

Snabbtest

Testa dina kunskaper om hur du öppnar en databas.

Besvara frågan i den interaktiva lektionen

Sammanfattning

Du har lärt dig att öppna en IndexedDB-databas:

indexedDB.open(name, version) returnerar en förfrågan.
Skapa objektlager endast i onupgradeneeded.
keyPath anger primärnyckeln; autoIncrement genererar nycklar.
Spara db från onsuccess för senare användning.
Hantera onerror och onblocked.

Nästa avsnitt handlar om transaktioner och CRUD-operationer.

Gratis att börja

Lär dig JavaScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 59
Lektioner: 200

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Öppna en databas” gratis?

Ja – du kan läsa vilka 3 lektioner som helst i lärvägen JavaScript Academy, inklusive ”Öppna en databas”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i JavaScript Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Öppna en databas”?

Skapa databaser och objektlager. Ni övar på JavaScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig JavaScript Academy?

Du behöver inga förkunskaper. Utbildningen i JavaScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 1 av 4.

Hur lång tid tar lektionen ”Öppna en databas”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här JavaScript Academy-lektionen?

Ja. Varje JavaScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till JavaScript Academy