html5indexeddb排序,HTML5本地存储IndexedDB基础介绍（二）- 游标和索引

引用文档：

在上一篇文章HTML5本地存储IndexedDB基础介绍(-)-数据库的简单增删改查向大家介绍了IndexedDB的简单增删改查，这篇文章将主要向大家介绍IndexedDB的游标与索引，通过游标与索引可以使得对于数据的查找更加方便，提高搜索速度

IndexedDB游标查询：

通过事务transaction可以根据已知的键检索单个对象，当我们需要检索多个对象或者遍历时就需要在事务内部创建游标。游标是指向结果集的指针。与传统数据库的查询不同，游标不提前收集结果。游标指针会先指向结果中的第一项，在接到查找下一项的指令时，才会指向下一项。

在对象存储空间上调用openCursor()方法可以创建游标，与IndexedDB其它操作一样，openCursor()方法返回的是IDBRequest，因此需要在onerror、onsuccess事件中处理程序。代码示例如下:

var store = db.transaction(storename,'readwrite').objectStore(storename);

var request = store.openCursor();//db为IDBDatabase对象

request.onerror = function(e){

}

request.onsuccess = function(e){

console.log('游标开始查询')

var cursor = e.target.result;

if(cursor){//必须要检查

console.log(cursor);

cursor.continue();//遍历了存储对象中的所有内容

}else{

}

};

从上述代码中可以看到在onsuccess事件处理程序中，有两行代码分别是:

var cursor = e.target.result

cursor.continue

e.target.result可以取得存储空间的下一个对象，当结果集中有下一个对象时，e.target.result是一个IDBCursor实例，没有下一个对象则为空。所以我们在查询之前都要用if判断一下是否有这个对象IDBCursor，下图为打印出来的cursor,打印出来的实例有以下几个属性：

direction：表示游标移动的方向

key:对象的键

value:查找出的对象

primaryKey:游标使用的键，可能是对象键，或者是索引键(目前尚未建立索引，所以图中键来自于学生的id)

图中我们看到出现的实例是IDBCursorWithValue而非上述所说的IDBCursor,google中控制台直接打出的就是这样的情况，官方API文档说两者的区别在于IDBCursorWithValue包含了value属性。

cursor.continue的作用在于使游标移动到结果集的下一项，默认情况下游标只发起一次请求，要想发起另一次请求使游标继续查找，则需调用continue(key)方法，该方法中参数可选，不指定参数，移到下一项，指定该参数，移到指定键的位置。

上述代码查找出结果如下,如果不加cursor.continue则会只出现第一条数据：

IndexedDB游标更新、删除：

游标更新主要使用了cursor.update(value),用指定的对象更新当前游标的value，代码如下：

function cursorUpdateData(db,storename){

//通过游标更新记录db为IDBDatabase对象,storename为存储空间名称

var store = db.transaction(storename,'readwrite').objectStore(storename);

var request = store.openCursor();

request.onsuccess = function(e){

console.log('游标开始查询')

var cursor = e.target.result,

value,

updateRequest;

if(cursor){//必须要检查

console.log(cursor);

if(cursor.key == 1002){

console.log('游标开始更新')

value = cursor.value;

value.age=38;

updateRequest = cursor.update(value);

updateRequest.onerror = function(){

console.log('游标更新失败');

};

updateRequest.onsuccess = function(){

console.log('游标更新成功');

}

}else{

cursor.continue();

}

}

};

}

游标删除主要使用了delete()方法，主要代码如下：

function cursorDeldteData(db,storename){

//通过游标删除记录

var store = db.transaction(storename,'readwrite').objectStore(storename);

var request = store.openCursor();

request.onsuccess = function(e){

var cursor = e.target.result,

value,

deleteRequest;

if(cursor){

if(cursor.key == 1003){

deleteRequest = cursor.delete();//请求删除当前项