前端IndexedDB数据库封装

IndexedDB

介绍

浏览器数据库 IndexedDB IndexedDB 就是浏览器提供的本地数据库,它可以被网页脚本创建和操作。IndexedDB 允许储存大量数据,提供查找接口,还能建立索引。这些都是 LocalStorage 所不具备的。就数据库类型而言,IndexedDB 不属于关系型数据库(不支持 SQL 查询语句),更接近 NoSQL 数据库。 IndexedDB 是一个比较复杂的 API,涉及不少概念。它把不同的实体,抽象成一个个对象接口。学习这个 API,就是学习它的各种对象接口。

数据库:IDBDatabase 对象 对象仓库:IDBObjectStore 对象 索引: IDBIndex 对象 事务: IDBTransaction 对象 操作请求:IDBRequest 对象 指针: IDBCursor 对象 主键集合:IDBKeyRange 对象 下面是一些主要的概念。

(1)数据库

数据库是一系列相关数据的容器。每个域名(严格的说,是协议 + 域名 + 端口)都可以新建任意多个数据库。

IndexedDB 数据库有版本的概念。同一个时刻,只能有一个版本的数据库存在。如果要修改数据库结构(新增或删除表、索引或者主键),只能通过升级数据库版本完成。

(2)对象仓库

每个数据库包含若干个对象仓库(object store)。它类似于关系型数据库的表格。

(3)数据记录

对象仓库保存的是数据记录。每条记录类似于关系型数据库的行,但是只有主键和数据体两部分。主键用来建立默认的索引,必须是不同的,否则会报错。主键可以是数据记录里面的一个属性,也可以指定为一个递增的整数编号。

上面的对象中,id属性可以当作主键。

数据体可以是任意数据类型,不限于对象。

(4)索引

为了加速数据的检索,可以在对象仓库里面,为不同的属性建立索引。

(5)事务

数据记录的读写和删改,都要通过事务完成。事务对象提供error、abort和complete三个事件,用来监听操作结果。

码云地址:IndexedDB

npm安装:

npm install yiu-indexeddb --save

yarn安装:

yarn add yiu-indexeddb

预览图

希望看完的朋友可以点个Star/关注,您的支持是对我最大的鼓励。

如果喜欢本文的话,欢迎关注我的订阅号,漫漫技术路,期待共同学习成长。

猜你喜欢

转载自blog.csdn.net/Jensen_Yao/article/details/120269413