记一次封装indexedDB的实践之CC_DB---七日打卡

IndexDB是什么?

IndexedDB是浏览器提供的本地数据库，它可以被网页脚本创建和操作。
IndexedDB 允许储存大量数据，提供查找接口，还能建立索引。就数据库类型而言，IndexedDB 不属于关系型数据库（不支持 SQL 查询语句），更接近 NoSQL 数据库。

CC_DB是什么?

CC_DB是一款个人对indexedDB的二次封装的前端数据库框架。

为什么用?

一、简洁的数据库操作语句；
二、高效的数据库操作性能；
三、让开发人员把精力都放在业务上,其它的由CC_DB来做。

使用方法:

一、安装

在vue项目的index.html文件中引入:

<script src="https://sysytest.oss-cn-beijing.aliyuncs.com/package/ccDB/ccdb0.1.min.js"></script>

二、使用指南

1.创建CC_DB实例对象

在成功引入上述的js文件后，CC_DB 构造函数就被挂载到window中了,然后就可以使用这个构造函数new实例对象了。
代码说明如下:

var ccdb = new window.Ccdb()

2.使用实例化对象创建表对象

ccdb.build(
	'yourDbName', //数据库名
	'yourTableName', // 表名
	1, //版本号
	{
		keyPath:'yourKeyPathName',//表的主键名
		autoIncrement:false,//是否自动生成主键
		index:[
			{
				keyName:'yourKeyName',//键名
				uniqueName:'yourIndexName',//索引名称
				unique:false//是否唯一
			}
		]
	}
)

3.获取表对象

表对象创建完后，将自动挂载到ccdb对象中，就可以直接使用ccdb访问。 yourDbName为创建的数据库名。 yourTableName为创建的表名。

4、插入数据

ccdb.yourDbName.yourTableName.insert({id:5,name:'流氓',sex:2,content:'你好',time:'2020-12-20'}).then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})
ccdb.yourDbName.yourTableName.insert(
	{id:5,name:'流氓',sex:2,content:'你好',time:'2020-12-20'},
	true //insert 的第二个参数为true 时 , 根据主键判断如果数据存在时更新数据，不存在时插入数据
	).then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

5、删除数据

ccdb.yourDbName.yourTableName.filter({sex:1}).delete().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

6、更新数据

ccdb.yourDbName.yourTableName.filter({sex:1}).update({sex:2}).then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

7.查询数据
(1)、查询对应表的所有数据 (all)

ccdb.yourDbName.yourTableName.all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(2)、查询第一条数据 (first)

ccdb.yourDbName.yourTableName.first().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(3)、查询最后一条数据（last）

ccdb.yourDbName.yourTableName.last().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(4)、分页查询数据

ccdb.yourDbName.yourTableName.limit(15).offset(0).then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(5)、过滤查询数据（filter）

ccdb.yourDbName.yourTableName.filter({id:5}).all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(6)、模糊过滤查询（filter）

ccdb.yourDbName.yourTableName.filter({
		id:{
			type:'like',
			value:/[0-9]+/   //正则
		}
	}).all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(7)、自定义过滤方法查询（filter）

ccdb.yourDbName.yourTableName.filter({
		yourKeyName:function(keyValue,item){
			//keyValue 为yourKeyName 的值
			//item 为遍历到的某条数据
			
			//...您的逻辑判断
			
			return true //返回 true 表示成功匹配此条数据 ，false 表示过滤掉此条数据
		}
	}).all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(8)、排序查询（sort）

参数说明：
第一个参数为指定排序的字段
第二个参数为排序的方式 next(升序)、 nextunique (升序去重)、prev (降序)、 prevunique(降序去重)

ccdb.yourDbName.yourTableName.sort('id','next').all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(9)、查询数据条数

ccdb.yourDbName.yourTableName.count().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

ccdb.yourDbName.yourTableName.filter({sex:1}).count().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

(10)、各个功能组合使用

ccdb.yourDbName.yourTableName.filter({sex:1}).limit(5).offset(0).then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

ccdb.yourDbName.yourTableName.filter({sex:1}).sort('id','prev').all().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})

//获取最后一个sex=1的数据
ccdb.yourDbName.yourTableName.filter({sex:1}).last().then((e)=>{
	if(e.status==200){
		console.log(e)
	}
})