HTML5 indexedDB数据库的入门学习,二

上一篇关于indexedDB的学习笔记主要写了indexedDB数据库的基本操作—增删改查;但是为什么我们要用indexedDB呢?为什么indexedDB受到了开发者们的青睐呢?最主要的就是indexedDB的几个核心功能:有了游标和索引和范围才能真正发挥indexedDB威力

1、索引:为什么它叫indexedDB?因为它提供给了我们通过索引(index)去查询我们需要的值;

2、游标:游标提供给我们循环查询到的数据,

3、范围:和游标一起结合指定我们需要循环的范围,

4、索引、游标、范围的综合应用可以给我们带来很好的数据交互体验

创建索引:

1 request.onupgradeneeded = function(event) {
2     db = event.target.result;
3     if(!db.objectStoreNames.contains("table")) {
4         var store = db.createObjectStore("table",{keyPath: "ssn"});
5     }
6     var index = store.createIndex("nameIndex","name",{unique:true});//创建name索引,后续我们可以通过name查找
7     console.log("createObjectStore success!");
8 };

通过游标读取数据:

 1 db.transaction("table").objectStore("table").openCursor().onsuccess = function(event) {//openCursor方法
 2     var getString = "";
 3     var cursor = event.target.result;
 4     if (cursor) {
 5         getString += "Name for SSN " + cursor.key + " is " + cursor.value.name;
 6         console.log("Name for SSN " + cursor.key + " is " + cursor.value.name);
 7         cursor.continue();
 8         //alert(getString);
 9     }
10     document.getElementById("get_ssn").innerHTML += getString+"<br/>";
11 }        

通过索引查找/读取数据://前提是在创建数据表的时候创建了索引index否则不能通过索引去访问

1 db.transaction("table")
2 .objectStore("table")
3 .index("nameIndex")
4 .get("chenjian")
5 .onsuccess = function() {
6     console.log(this.result.email);
7 };

索引index和游标cursor的混合应用:

 1 db.transaction("table")
 2 .objectStore("table")
 3 .index("nameIndex")
 4 .openCursor(IDBKeyRange.only(”chenjian“))
 5 .onsuccess = function() {
 6     var cursor = event.target.result;
 7     if (cursor) {
 8         console.log(cursor.key + cursor.value.name);
 9     cursor.continue();
10     }
11 };    

openCursor()方法可以传入指定范围的参数:如下

指定范围:

1 index.openCursor()/index.openKeyCursor()方法在不传递参数的时候会获取object store所有记录,像上面例子一样我们可以对搜索进行筛选
2 可以使用key range 限制游标中值的范围,把它作为第一个参数传给 openCursor() 或是 openKeyCursor()
3 IDBKeyRange.only(value):只获取指定数据
4 IDBKeyRange.lowerBound(value,isOpen):获取最小是value的数据,第二个参数用来指示是否排除value值本身,也就是数学中的是否是开区间
5 IDBKeyRange.upperBound(value,isOpen):和上面类似,用于获取最大值是value的数据
6 IDBKeyRange.bound(value1,value2,isOpen1,isOpen2):不用解释了吧

当传入了指定的范围,游标便只在范围中循环输出