JavaScript Academy · Lección

Transacciones y CRUD

Añada, lea, actualice y elimine registros.

Transacciones y CRUD es una lección gratuita de JavaScript Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de JavaScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de JavaScript Academy incluye 4 lecciones en total.

Todo es una transacción

En IndexedDB, todas las lecturas y escrituras se realizan dentro de una transacción. Una transacción agrupa las operaciones para que todas se completen correctamente o se reviertan, manteniendo la coherencia de los datos.

Inicio de una transacción

Cree una con db.transaction(storeNames, mode). El modo es 'readonly' (predeterminado) o 'readwrite' para realizar modificaciones.

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

Obtención del almacén de objetos

Desde la transacción, obtenga el almacén de objetos con el que desea trabajar mediante tx.objectStore(name). Todos los métodos CRUD se encuentran en este almacén.

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

Adición de registros

store.add(value) inserta un registro nuevo. Falla si ya existe un registro con la misma clave, lo que protege contra sobrescrituras accidentales.

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

Lectura de un registro

store.get(key) recupera un registro mediante su clave. El resultado llega en onsuccess de la solicitud como request.result (undefined si no se encuentra).

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

Actualización con put

store.put(value) inserta o reemplaza un registro. A diferencia de add, sobrescribe un registro existente con la misma clave, por lo que resulta ideal para las actualizaciones.

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

Eliminación de un registro

store.delete(key) elimina el registro con la clave indicada. Se completa correctamente incluso si no existe ningún registro con esa clave.

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

Vaciado de un almacén

store.clear() elimina de una vez todos los registros del almacén de objetos. Úselo para restablecer los datos en caché.

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

Finalización de una transacción

La propia transacción genera oncomplete cuando se han confirmado todas sus operaciones, y onerror o onabort si algo falla. Use oncomplete para saber que las escrituras son persistentes.

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

Comportamiento de confirmación automática

Las transacciones se confirman automáticamente cuando el control vuelve al bucle de eventos y no quedan solicitudes pendientes. No puede mantener una transacción abierta mientras espera un await de trabajo asíncrono no relacionado; realice todas las operaciones del almacén juntas.

// 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.

Resumen de CRUD

Las cuatro operaciones principales se corresponden claramente:

Crear: add
Leer: get
Actualizar: put
Eliminar: delete

Todo se ejecuta dentro de una transacción que garantiza la consistencia.

Comprobación rápida

Compruebe su comprensión de las transacciones y CRUD.

Repaso

Ha aprendido sobre transacciones y CRUD:

Comience con db.transaction(store, mode).
Obtenga el almacén con tx.objectStore(name).
add inserta, get lee, put inserta o actualiza y delete elimina.
Los resultados llegan mediante el evento onsuccess de cada solicitud.
tx.oncomplete confirma que los cambios se han guardado.

A continuación, índices y consultas.

Preguntas frecuentes

¿La lección «Transacciones y CRUD» es gratis?

Sí — el texto completo de «Transacciones y CRUD» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de JavaScript Academy, actualiza a CoddyKit PRO. El curso de JavaScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Transacciones y CRUD»?

Añada, lea, actualice y elimine registros. Practicas JavaScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar JavaScript Academy?

No se requiere experiencia previa. JavaScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.

¿Cuánto tiempo toma la lección «Transacciones y CRUD»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de JavaScript Academy?

Sí. Cada lección de JavaScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

← Volver a JavaScript Academy