网站建站流程图,中教在线3d建模培训,网站移动端流量,企业网络安全培训内容IndexedDB - 浏览器内容数据库
indexedDB 是一种浏览器内置的NoSQL数据库#xff0c;它使用键值对存储数据#xff0c;用于在客户端存储大量结构化数据。它支持离线应用程序和高效的数据检索#xff0c;可以在 Web 应用程序中替代传统的 cookie 和 localStorage。 IndexDB是…IndexedDB - 浏览器内容数据库
indexedDB 是一种浏览器内置的NoSQL数据库它使用键值对存储数据用于在客户端存储大量结构化数据。它支持离线应用程序和高效的数据检索可以在 Web 应用程序中替代传统的 cookie 和 localStorage。 IndexDB是一种在浏览器中内置的NoSQL数据库用于在客户端存储和检索数据。它提供了一种持久存储数据的方式可以在离线状态下使用。
使用 indexedDB 需要以下步骤 打开数据库使用 indexedDB.open() 方法打开一个数据库如果数据库不存在则会创建一个新的数据库。 创建对象存储空间使用 createObjectStore() 方法创建一个对象存储空间用于存储数据。可以为每个对象存储空间设置一个名称和一个键路径键路径用于指定对象存储空间中的每个对象的唯一标识符。 存储数据使用 add() 或 put() 方法将数据存储到对象存储空间中。add() 方法用于向对象存储空间中添加新的数据如果该数据已经存在则会抛出错误。put() 方法用于向对象存储空间中添加或更新数据。 检索数据使用 get() 或 getAll() 方法从对象存储空间中检索数据。get() 方法用于检索指定键路径的数据getAll() 方法用于检索对象存储空间中的所有数据。 删除数据使用 delete() 方法从对象存储空间中删除指定键路径的数据。 关闭数据库使用 close() 方法关闭数据库连接。
需要注意的是indexedDB 使用异步 API需要使用回调函数或 Promise 处理返回结果。此外indexedDB 只能在支持该 API 的浏览器中使用需要检查浏览器是否支持 indexedDB API。
indexedDB 和 localStorage 的区别
indexedDB 和 localStorage 都是浏览器提供的客户端存储方案它们之间的区别主要有以下几点 数据存储方式localStorage 存储的是字符串类型的数据而 indexedDB 存储的是结构化数据。indexedDB 支持存储复杂的数据类型例如对象、数组等而 localStorage 只能存储字符串类型的数据。 存储容量localStorage 的存储容量通常为 5MB 左右而 indexedDB 的存储容量通常为几百 MB 或几 GB。indexedDB 可以存储大量的数据适用于需要存储大量结构化数据的应用程序。 数据检索方式indexedDB 支持基于索引的高效数据检索可以通过索引快速查询数据。而 localStorage 只能遍历整个数据集合进行数据检索效率较低。 事务支持indexedDB 支持事务操作可以确保数据的一致性和完整性。而 localStorage 不支持事务操作无法保证数据的一致性和完整性。 浏览器支持indexedDB API 在较新版本的浏览器中得到支持而 localStorage API 在大多数浏览器中都得到支持。
综上所述indexedDB 更适合存储大量结构化数据并且支持高效的数据检索和事务操作而 localStorage 更适合存储少量简单的字符串类型数据。
demo演示
// 打开或创建一个名为myDatabase的数据库
const request indexedDB.open(myDatabase, 1);// 当数据库打开成功时触发
request.onsuccess function(event) {const db event.target.result;// 创建一个名为myObjectStore的对象存储空间const objectStore db.createObjectStore(myObjectStore, { keyPath: id });// 添加一些数据到对象存储空间const data [{ id: 1, name: John },{ id: 2, name: Jane },{ id: 3, name: Bob }];// 通过db.transaction(myObjectStore, readwrite)创建一个名为myObjectStore的对象存储空间的读写事务。这里的readwrite表示事务的模式允许读取和写入数据。const transaction db.transaction(myObjectStore, readwrite);// 通过transaction.objectStore(myObjectStore)获取到名为myObjectStore的对象存储空间的引用以便后续对该对象存储空间进行操作如添加、更新或删除数据。const store transaction.objectStore(myObjectStore);data.forEach(function(item) {store.add(item);});// 数据添加完成后关闭数据库连接transaction.oncomplete function() {db.close();};
};// 当数据库打开失败时触发
request.onerror function(event) {console.log(打开数据库失败);
};keyPath是IndexDB中用于定义对象存储空间中每个对象的唯一键的属性。这个键可以是任何一个对象中的属性例如ID、名称或日期等。在创建对象存储空间时可以通过指定keyPath属性来定义唯一键。这样在添加、更新或删除数据时可以使用这个唯一键来引用和操作对象。 补充 不是所有数据库操作都必须通过事务来进行。事务Transaction是数据库管理系统DBMS中的一个重要概念用于确保数据库操作的一致性和完整性。事务是一系列数据库操作的单个逻辑工作单元要么全部执行成功要么全部回滚撤销以保持数据库在任何时间点都处于一致状态。
虽然事务提供了一种确保数据完整性的机制但并不是所有的数据库操作都需要使用事务。以下是一些情况 简单查询 对于只涉及到读取而不涉及写入的简单查询通常不需要使用事务。例如SELECT语句可以独立执行而不需要事务的保障。 单一操作 当某个数据库操作是独立的、不依赖其他操作的时候也可以不使用事务。例如插入一条新纪录如果这个操作不依赖于其他操作的结果可能可以不使用事务。 不需要一致性保障 在某些特定的情况下如果不需要对数据库的一致性进行强制保障那么可以选择不使用事务。这通常发生在对实时性要求较高、而一致性要求相对较低的应用中。
然而在涉及到多个数据库操作、需要一致性保障、需要保证原子性、一致性、隔离性和持久性ACID属性的情况下事务就显得尤为重要。在复杂的业务逻辑中使用事务能够确保数据库的数据始终保持在一致的状态。
