JavaScript Academy · Lekcja

Transakcje i CRUD

Proszę dodawać, odczytywać, aktualizować i usuwać rekordy.

Transakcje i CRUD to bezpłatna lekcja JavaScript Academy na CoddyKit. To lekcja 2 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej JavaScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs JavaScript Academy zawiera 4 lekcji w sumie.

Wszystko jest transakcją

W IndexedDB wszystkie odczyty i zapisy odbywają się wewnątrz transakcji. Transakcja grupuje operacje, dzięki czemu albo wszystkie kończą się powodzeniem, albo wszystkie zostają wycofane, co zapewnia spójność danych.

Rozpoczynanie transakcji

Transakcję tworzy się za pomocą db.transaction(storeNames, mode). Tryb to 'readonly' (domyślny) albo 'readwrite' w przypadku modyfikacji.

const tx = db.transaction('notes', 'readwrite');
const store = tx.objectStore('notes');

Pobieranie magazynu obiektów

Z poziomu transakcji należy pobrać magazyn obiektów, z którym chce się pracować, za pomocą tx.objectStore(name). Na tym magazynie znajdują się wszystkie metody CRUD.

const tx = db.transaction('notes', 'readwrite');
const store = tx.objectStore('notes');
// store.add / get / put / delete

Dodawanie rekordów

store.add(value) wstawia nowy rekord. Operacja kończy się niepowodzeniem, jeśli rekord o tym samym kluczu już istnieje, co chroni przed przypadkowym nadpisaniem.

const store = tx.objectStore('notes');
const req = store.add({ id: 1, text: 'Buy milk' });
req.onsuccess = () => console.log('added with key', req.result);

Odczytywanie rekordu

store.get(key) pobiera jeden rekord na podstawie jego klucza. Wynik jest dostępny w procedurze obsługi onsuccess żądania jako request.result (undefined, jeśli rekordu nie znaleziono).

const req = store.get(1);
req.onsuccess = () => {
  console.log('record:', req.result);
};

Aktualizowanie za pomocą put

store.put(value) wstawia rekord lub go zastępuje. W przeciwieństwie do add nadpisuje istniejący rekord o tym samym kluczu, dzięki czemu idealnie nadaje się do aktualizacji.

store.put({ id: 1, text: 'Buy milk and eggs' });
// Replaces the existing record with id 1.

Usuwanie rekordu

store.delete(key) usuwa rekord o podanym kluczu. Operacja kończy się powodzeniem nawet wtedy, gdy taki rekord nie istnieje.

const req = store.delete(1);
req.onsuccess = () => console.log('deleted');

Czyszczenie magazynu

store.clear() jednocześnie usuwa wszystkie rekordy z magazynu obiektów. Należy używać go do resetowania danych w pamięci podręcznej.

store.clear();
// All records in 'notes' are removed.

Zakończenie transakcji

Sama transakcja wywołuje oncomplete, gdy wszystkie jej operacje zostaną zatwierdzone, oraz onerror lub onabort, jeśli coś się nie powiedzie. oncomplete pozwala upewnić się, że zapisy zostały trwale zachowane.

tx.oncomplete = () => console.log('all changes saved');
tx.onerror = () => console.log('transaction failed');

Działanie automatycznego zatwierdzania

Transakcje są automatycznie zatwierdzane, gdy sterowanie wraca do pętli zdarzeń i nie ma oczekujących żądań. Nie można utrzymywać transakcji otwartej podczas await niezwiązanej pracy asynchronicznej; wszystkie operacje na magazynie należy wykonać razem.

// Queue operations synchronously within the same tx:
store.add({ id: 2, text: 'A' });
store.add({ id: 3, text: 'B' });
// Both commit together when tx completes.

Podsumowanie CRUD

Cztery podstawowe operacje odpowiadają sobie w prosty sposób:

Create: add
Read: get
Update: put
Delete: delete

Wszystko odbywa się w ramach transakcji, która gwarantuje spójność danych.

Szybkie sprawdzenie

Sprawdź swoją wiedzę na temat transakcji i CRUD.

Podsumowanie

Dowiedział się Pan / Dowiedziała się Pani, czym są transakcje i CRUD:

Rozpoczyna się od db.transaction(store, mode).
Magazyn uzyskuje się za pomocą tx.objectStore(name).
add wstawia dane, get je odczytuje, put wykonuje operację upsert, a delete je usuwa.
Wyniki są dostępne w zdarzeniu onsuccess każdego żądania.
tx.oncomplete potwierdza zapisanie zmian.

Następnie indeksy i zapytania.

Często zadawane pytania

Czy lekcja „Transakcje i CRUD” jest bezpłatna?

Tak — pełny tekst „Transakcje i CRUD” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu JavaScript Academy, przejdź na CoddyKit PRO. Kurs JavaScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Transakcje i CRUD”?

Proszę dodawać, odczytywać, aktualizować i usuwać rekordy. Ćwiczysz JavaScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć JavaScript Academy?

Nie wymagamy żadnego doświadczenia. JavaScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 4.

Ile czasu zajmuje lekcja „Transakcje i CRUD”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji JavaScript Academy?

Tak. Każda lekcja JavaScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

← Powrót do JavaScript Academy