0Pricing
JavaScript Academy · 课时

事务与 CRUD

添加、读取、更新和删除记录。

事务与 CRUD 是 CoddyKit 上的免费 JavaScript Academy 课时。 这是第 2 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 JavaScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 4 节课。

一切都是 transaction

在 IndexedDB 中,所有读取和写入都发生在 transaction 内。一个 transaction 会将多个操作组合起来,使它们要么全部成功,要么全部回滚,从而保持数据一致。

开始 transaction

使用 db.transaction(storeNames, mode) 创建 transaction。模式可以是 'readonly'(默认值),也可以是用于修改数据的 'readwrite'。

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

获取对象仓库

通过 transaction 使用 tx.objectStore(name) 获取要操作的对象仓库。所有增删改查方法都位于这个对象仓库上。

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

添加记录

store.add(value) 会插入一条新记录。如果已存在具有相同键的记录,操作就会失败,从而避免意外覆盖数据。

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

读取记录

store.get(key) 会根据键获取一条记录。结果会在 request 的 onsuccess 中以 request.result 的形式到达(如果未找到记录,则为 undefined)。

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

使用 put 更新

store.put(value) 会插入或替换一条记录。与 add 不同,它会覆盖具有相同键的现有记录,因此非常适合更新数据。

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

删除记录

store.delete(key) 会删除具有指定键的记录。即使不存在这样的记录,操作也会成功。

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

清空对象仓库

store.clear() 会一次性删除对象仓库中的所有记录。您可以使用它来重置缓存数据。

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

transaction 完成

当所有操作都已提交时,transaction 本身会触发 oncomplete;如果发生故障,则会触发 onerror 或 onabort。请使用 oncomplete 确认写入已经持久化。

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

自动提交行为

当没有待处理的 request 且控制权返回事件循环时,transaction 会自动提交。您不能让一个 transaction 跨越与之无关的异步工作中的 await,请将所有对象仓库操作放在一起完成。

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

增删改查概述

四项核心操作可以清晰地对应起来:

  • 创建:add
  • 读取:get
  • 更新:put
  • 删除:delete

所有操作都在事务中进行,从而保证一致性。

快速检查

测试您对事务和增删改查的理解。

回顾

您学习了事务和增删改查:

  • 使用 db.transaction(store, mode) 开始事务。
  • 使用 tx.objectStore(name) 获取对象存储。
  • add 插入数据,get 读取数据,put 更新或插入数据,delete 删除数据。
  • 每个请求的结果都会在其 onsuccess 中返回。
  • tx.oncomplete 确认更改已保存。

接下来学习索引和查询。

常见问题解答

「事务与 CRUD」课时是免费的吗?

是的 — 「事务与 CRUD」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 JavaScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 4 节课。

「事务与 CRUD」这节课中我会学到什么?

添加、读取、更新和删除记录。 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 JavaScript Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 2 节课,共 4 节。

「事务与 CRUD」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 JavaScript Academy 课中编写并运行代码吗?

能。每节 JavaScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 打开数据库
  2. 事务与 CRUD
  3. 索引与查询
  4. 版本管理与升级
← 返回 JavaScript Academy