javascript - 等待 openCursor 在 IndexedDB 中完成

Question

我有这个代码:

html5DB.indexedDB.addSomething = function(foo) {
    var db = html5DB.indexedDB.db;
    var trans = db.transaction(["something"], "readwrite");
    var store = trans.objectStore("something");

    var isExisting = IsAlreadyExist(foo);
    // How to wait for that instruction to finish?

    if (!isExisting){
       var request = store.put({
           "text": foo,
           "timeStamp" : new Date().getTime()
       });
    }
};

我试图了解如何等待函数 IsAlreadyExist 完成。此函数打开一个游标以在对象存储中迭代以确定是否存在特定值。

实际上，没有错误，但我无法访问 if (!isExisting) 中的代码，因为变量的值永远不会改变。

这是第二个函数的代码:

function IsAlreadyExist(foo){
    var db = html5DB.indexedDB.db;
    var objectStore = db.transaction("something").objectStore("something");

    objectStore.openCursor().onsuccess = function(event) {
        var cursor = event.target.result;

        if (cursor) {
            if (cursor.value.text == foo)   
                return true;

            cursor.continue();
       }
    };

    return false;
}

有没有办法等待执行结束？或者这可能不是继续检查值是否存在的好方法？

Answer 1

由于 IndexedDB 是一个异步 API，您必须等待操作使用回调完成。

首先我们需要重构 IsAlreadyExist 方法:

function IsAlreadyExist(foo, oncomplete) {
    var db = html5DB.indexedDB.db;
    var transaction = db.transaction("something");
    var objectStore = transaction.objectStore("something");

    var exists = false;

    objectStore.openCursor().onsuccess = function(event) {
        var cursor = event.target.result;

        if (cursor) {
            if (cursor.value.text == foo) {
                exists = true;
                return;
            }

            cursor.continue();
       }
    };

    transaction.oncomplete = function () {
        oncompleted(exists);
    };
}

现在我们将重构您的其他方法:

html5DB.indexedDB.addSomething = function(foo) {
    IsAlreadyExist(foo, function (isExisting) {
        if (!isExisting){
           var db = html5DB.indexedDB.db;
           var trans = db.transaction(["something"], "readwrite");
           var store = trans.objectStore("something");

           var request = store.put({
               "text": foo,
               "timeStamp" : new Date().getTime()
           });
        }
    });
};

所以在这里你会看到我们将光标搜索完成时作为回调传递的函数执行，它接收状态参数。

这可能开始变得有点难看，这就是为什么 Promise的在 JavaScript 中很流行。我为 IndexedDB 编写了一个包装器，它使用一个名为 db.js 的基于 Promise 的 API。 .