indexedDB正确用法

时间:2014-09-23 19:53:23

标签: javascript indexeddb

我正在尝试使用indexedDB。现在一切都像异步一样,伤害了我的大脑。

我创建了一个这样的对象:

var application = {};
application.indexedDB = {};
application.indexedDB.db = null;

application.indexedDB.open = function() {

   var dbName = "application";
   var dbVersion = 1;

   var openRequest = indexedDB.open(dbName, dbVersion);

   openRequest.onupgradeneeded = function(e) {

      console.log("Upgrading your DB (" + dbName + ", v" + dbVersion + ")...");

      var thisDB = e.target.result;

      if (!thisDB.objectStoreNames.contains("journal")) {
         thisDB.createObjectStore(
            "journal", 
            {keyPath: "id"}
         );
      }
   }

   openRequest.onsuccess = function(e) {
      console.log("Opened DB (" + dbName + ", v" + dbVersion + ")");
      application.indexedDB.db = e.target.result;
   }

   openRequest.onerror = function(e) {
      console.log("Error");
      console.dir(e);
   }
};

现在我可以使用application.indexedDB.open()打开dbconnection。现在我在我的对象中添加了另一个函数:

application.indexedDB.addItemToTable = function(item, table) {

    var transaction = application.indexedDB.db.transaction([table], "readwrite");
    var store = transaction.objectStore(table);

    //Perform the add
    var request = store.add(item);

    request.onerror = function(e) {
        console.log("Error", e.target.error.name);
        //some type of error handler
    }

    request.onsuccess = function(e) {
        console.log("Woot! Did it");
    }
};

我的指令序列扩展如下:

  1. application.indexedDB.open()
  2. application.indexedDB.addItemToTable(item, "journal")
  3. 但这不起作用。因为open-Instruction是异步的,所以当我在addItemToTable-Function中调用它时,application.indexedDB.db还不可用。 Javascript-Developer如何解决这个问题?

    我在这里遵循这个教程:http://code.tutsplus.com/tutorials/working-with-indexeddb--net-34673现在我对这些示例有一些问题。

    例如,他直接在" onsuccess" -Part(在" Read More Data" Section)中创建HTML-Output。在我看来,这是错误的编码,因为视图与数据库读取部分无关..不是吗?但接下来是我的问题。你怎么能在" onsuccess" -Part中返回一些东西? 添加回调函数有点复杂。特别是当我想读取一些数据并使用该结果集获得更多数据时。描述我的意思非常复杂。 我做了一点小提琴 - 也许它澄清了事情...... - http://jsfiddle.net/kb8nuby6/

    谢谢

2 个答案:

答案 0 :(得分:2)

您不需要使用其他人的额外计划。在使用indexedDB之前,您需要了解异步javascript(AJAX)。没有办法避免它。您无需了解indexedDB即可了解AJAX。例如,查看XMLHttpRequest的工作原理。了解setTimeout和setInterval。也许了解requestAnimationFrame。如果你知道nodejs的东西,请查看process.nextTick。了解函数如何成为一流的。了解使用回调函数的想法。了解继续传递风格。

你可能无法得到你正在寻找这个问题的答案。如果有的话,这是关于javascript中异步编程的堆栈溢出的几千个其他问题的复制品。它甚至与indexedDB无关。看看有关异步js的许多其他问题。

也许这会让你开始:

var a;
setTimeout(function() { a = 1; }, 10);
console.log('The value of a is %s', a);

弄清楚为什么不起作用。如果你这样做,你将更接近于找到这个问题的答案。

答案 1 :(得分:0)

我通常采用的模式是等待所有数据库操作,直到连接。它与jQuery中的$.ready类似。

您会发现,随着应用程序的老化,您有许多架构版本,并且还需要升级数据。数据库连接本身有很多逻辑。

如果您需要在准备好之前使用数据库,则可以使用回调队列。以下是commend queue上的Google分析摘要:

// Creates an initial ga() function.  The queued commands will be executed once analytics.js loads.
i[r] = i[r] || function() {
  (i[r].q = i[r].q || []).push(arguments)
},

基本上,一旦数据库连接,您将执行这些回调。

我强烈建议您查看我自己的图书馆ydn-db。它有所有这些概念。