JavaScript IndexedDb API

2023-03-20 15:43 更新

概述 

隨著瀏覽器的功能不斷增強(qiáng),越來越多的網(wǎng)站開始考慮,將大量數(shù)據(jù)儲(chǔ)存在客戶端,這樣可以減少從服務(wù)器獲取數(shù)據(jù),直接從本地獲取數(shù)據(jù)。

現(xiàn)有的瀏覽器數(shù)據(jù)儲(chǔ)存方案,都不適合儲(chǔ)存大量數(shù)據(jù):Cookie 的大小不超過 4KB,且每次請(qǐng)求都會(huì)發(fā)送回服務(wù)器;LocalStorage 在 2.5MB 到 10MB 之間(各家瀏覽器不同),而且不提供搜索功能,不能建立自定義的索引。所以,需要一種新的解決方案,這就是 IndexedDB 誕生的背景。

通俗地說,IndexedDB 就是瀏覽器提供的本地?cái)?shù)據(jù)庫,它可以被網(wǎng)頁腳本創(chuàng)建和操作。IndexedDB 允許儲(chǔ)存大量數(shù)據(jù),提供查找接口,還能建立索引。這些都是 LocalStorage 所不具備的。就數(shù)據(jù)庫類型而言,IndexedDB 不屬于關(guān)系型數(shù)據(jù)庫(不支持 SQL 查詢語句),更接近 NoSQL 數(shù)據(jù)庫。

IndexedDB 具有以下特點(diǎn)。

(1)鍵值對(duì)儲(chǔ)存。 IndexedDB 內(nèi)部采用對(duì)象倉庫(object store)存放數(shù)據(jù)。所有類型的數(shù)據(jù)都可以直接存入,包括 JavaScript 對(duì)象。對(duì)象倉庫中,數(shù)據(jù)以“鍵值對(duì)”的形式保存,每一個(gè)數(shù)據(jù)記錄都有對(duì)應(yīng)的主鍵,主鍵是獨(dú)一無二的,不能有重復(fù),否則會(huì)拋出一個(gè)錯(cuò)誤。

(2)異步。 IndexedDB 操作時(shí)不會(huì)鎖死瀏覽器,用戶依然可以進(jìn)行其他操作,這與 LocalStorage 形成對(duì)比,后者的操作是同步的。異步設(shè)計(jì)是為了防止大量數(shù)據(jù)的讀寫,拖慢網(wǎng)頁的表現(xiàn)。

(3)支持事務(wù)。 IndexedDB 支持事務(wù)(transaction),這意味著一系列操作步驟之中,只要有一步失敗,整個(gè)事務(wù)就都取消,數(shù)據(jù)庫回滾到事務(wù)發(fā)生之前的狀態(tài),不存在只改寫一部分?jǐn)?shù)據(jù)的情況。

(4)同源限制。 IndexedDB 受到同源限制,每一個(gè)數(shù)據(jù)庫對(duì)應(yīng)創(chuàng)建它的域名。網(wǎng)頁只能訪問自身域名下的數(shù)據(jù)庫,而不能訪問跨域的數(shù)據(jù)庫。

(5)儲(chǔ)存空間大。 IndexedDB 的儲(chǔ)存空間比 LocalStorage 大得多,一般來說不少于 250MB,甚至沒有上限。

(6)支持二進(jìn)制儲(chǔ)存。 IndexedDB 不僅可以儲(chǔ)存字符串,還可以儲(chǔ)存二進(jìn)制數(shù)據(jù)(ArrayBuffer 對(duì)象和 Blob 對(duì)象)。

基本概念 

IndexedDB 是一個(gè)比較復(fù)雜的 API,涉及不少概念。它把不同的實(shí)體,抽象成一個(gè)個(gè)對(duì)象接口。學(xué)習(xí)這個(gè) API,就是學(xué)習(xí)它的各種對(duì)象接口。

  • 數(shù)據(jù)庫:IDBDatabase 對(duì)象
  • 對(duì)象倉庫:IDBObjectStore 對(duì)象
  • 索引: IDBIndex 對(duì)象
  • 事務(wù): IDBTransaction 對(duì)象
  • 操作請(qǐng)求:IDBRequest 對(duì)象
  • 指針: IDBCursor 對(duì)象
  • 主鍵集合:IDBKeyRange 對(duì)象

下面是一些主要的概念。

(1)數(shù)據(jù)庫

數(shù)據(jù)庫是一系列相關(guān)數(shù)據(jù)的容器。每個(gè)域名(嚴(yán)格的說,是協(xié)議 + 域名 + 端口)都可以新建任意多個(gè)數(shù)據(jù)庫。

IndexedDB 數(shù)據(jù)庫有版本的概念。同一個(gè)時(shí)刻,只能有一個(gè)版本的數(shù)據(jù)庫存在。如果要修改數(shù)據(jù)庫結(jié)構(gòu)(新增或刪除表、索引或者主鍵),只能通過升級(jí)數(shù)據(jù)庫版本完成。

(2)對(duì)象倉庫

每個(gè)數(shù)據(jù)庫包含若干個(gè)對(duì)象倉庫(object store)。它類似于關(guān)系型數(shù)據(jù)庫的表格。

(3)數(shù)據(jù)記錄

對(duì)象倉庫保存的是數(shù)據(jù)記錄。每條記錄類似于關(guān)系型數(shù)據(jù)庫的行,但是只有主鍵和數(shù)據(jù)體兩部分。主鍵用來建立默認(rèn)的索引,必須是不同的,否則會(huì)報(bào)錯(cuò)。主鍵可以是數(shù)據(jù)記錄里面的一個(gè)屬性,也可以指定為一個(gè)遞增的整數(shù)編號(hào)。

{ id: 1, text: 'foo' }

上面的對(duì)象中,id屬性可以當(dāng)作主鍵。

數(shù)據(jù)體可以是任意數(shù)據(jù)類型,不限于對(duì)象。

(4)索引

為了加速數(shù)據(jù)的檢索,可以在對(duì)象倉庫里面,為不同的屬性建立索引。

(5)事務(wù)

數(shù)據(jù)記錄的讀寫和刪改,都要通過事務(wù)完成。事務(wù)對(duì)象提供error、abortcomplete三個(gè)事件,用來監(jiān)聽操作結(jié)果。

操作流程 

IndexedDB 數(shù)據(jù)庫的各種操作,一般是按照下面的流程進(jìn)行的。這個(gè)部分只給出簡(jiǎn)單的代碼示例,用于快速上手,詳細(xì)的各個(gè)對(duì)象的 API 放在后文介紹。

打開數(shù)據(jù)庫 

使用 IndexedDB 的第一步是打開數(shù)據(jù)庫,使用indexedDB.open()方法。

var request = window.indexedDB.open(databaseName, version);

這個(gè)方法接受兩個(gè)參數(shù),第一個(gè)參數(shù)是字符串,表示數(shù)據(jù)庫的名字。如果指定的數(shù)據(jù)庫不存在,就會(huì)新建數(shù)據(jù)庫。第二個(gè)參數(shù)是整數(shù),表示數(shù)據(jù)庫的版本。如果省略,打開已有數(shù)據(jù)庫時(shí),默認(rèn)為當(dāng)前版本;新建數(shù)據(jù)庫時(shí),默認(rèn)為1。

indexedDB.open()方法返回一個(gè) IDBRequest 對(duì)象。這個(gè)對(duì)象通過三種事件error、successupgradeneeded,處理打開數(shù)據(jù)庫的操作結(jié)果。

(1)error 事件

error事件表示打開數(shù)據(jù)庫失敗。

request.onerror = function (event) {
  console.log('數(shù)據(jù)庫打開報(bào)錯(cuò)');
};

(2)success 事件

success事件表示成功打開數(shù)據(jù)庫。

var db;

request.onsuccess = function (event) {
  db = request.result;
  console.log('數(shù)據(jù)庫打開成功');
};

這時(shí),通過request對(duì)象的result屬性拿到數(shù)據(jù)庫對(duì)象。

(3)upgradeneeded 事件

如果指定的版本號(hào),大于數(shù)據(jù)庫的實(shí)際版本號(hào),就會(huì)發(fā)生數(shù)據(jù)庫升級(jí)事件upgradeneeded。

var db;

request.onupgradeneeded = function (event) {
  db = event.target.result;
}

這時(shí)通過事件對(duì)象的target.result屬性,拿到數(shù)據(jù)庫實(shí)例。

新建數(shù)據(jù)庫 

新建數(shù)據(jù)庫與打開數(shù)據(jù)庫是同一個(gè)操作。如果指定的數(shù)據(jù)庫不存在,就會(huì)新建。不同之處在于,后續(xù)的操作主要在upgradeneeded事件的監(jiān)聽函數(shù)里面完成,因?yàn)檫@時(shí)版本從無到有,所以會(huì)觸發(fā)這個(gè)事件。

通常,新建數(shù)據(jù)庫以后,第一件事是新建對(duì)象倉庫(即新建表)。

request.onupgradeneeded = function(event) {
  db = event.target.result;
  var objectStore = db.createObjectStore('person', { keyPath: 'id' });
}

上面代碼中,數(shù)據(jù)庫新建成功以后,新增一張叫做person的表格,主鍵是id。

更好的寫法是先判斷一下,這張表格是否存在,如果不存在再新建。

request.onupgradeneeded = function (event) {
  db = event.target.result;
  var objectStore;
  if (!db.objectStoreNames.contains('person')) {
    objectStore = db.createObjectStore('person', { keyPath: 'id' });
  }
}

主鍵(key)是默認(rèn)建立索引的屬性。比如,數(shù)據(jù)記錄是{ id: 1, name: '張三' },那么id屬性可以作為主鍵。主鍵也可以指定為下一層對(duì)象的屬性,比如{ foo: { bar: 'baz' } }foo.bar也可以指定為主鍵。

如果數(shù)據(jù)記錄里面沒有合適作為主鍵的屬性,那么可以讓 IndexedDB 自動(dòng)生成主鍵。

var objectStore = db.createObjectStore(
  'person',
  { autoIncrement: true }
);

上面代碼中,指定主鍵為一個(gè)遞增的整數(shù)。

新建對(duì)象倉庫以后,下一步可以新建索引。

request.onupgradeneeded = function(event) {
  db = event.target.result;
  var objectStore = db.createObjectStore('person', { keyPath: 'id' });
  objectStore.createIndex('name', 'name', { unique: false });
  objectStore.createIndex('email', 'email', { unique: true });
}

上面代碼中,IDBObject.createIndex()的三個(gè)參數(shù)分別為索引名稱、索引所在的屬性、配置對(duì)象(說明該屬性是否包含重復(fù)的值)。

新增數(shù)據(jù) 

新增數(shù)據(jù)指的是向?qū)ο髠}庫寫入數(shù)據(jù)記錄。這需要通過事務(wù)完成。

function add() {
  var request = db.transaction(['person'], 'readwrite')
    .objectStore('person')
    .add({ id: 1, name: '張三', age: 24, email: 'zhangsan@example.com' });

  request.onsuccess = function (event) {
    console.log('數(shù)據(jù)寫入成功');
  };

  request.onerror = function (event) {
    console.log('數(shù)據(jù)寫入失敗');
  }
}

add();

上面代碼中,寫入數(shù)據(jù)需要新建一個(gè)事務(wù)。新建時(shí)必須指定表格名稱和操作模式(“只讀”或“讀寫”)。新建事務(wù)以后,通過IDBTransaction.objectStore(name)方法,拿到 IDBObjectStore 對(duì)象,再通過表格對(duì)象的add()方法,向表格寫入一條記錄。

寫入操作是一個(gè)異步操作,通過監(jiān)聽連接對(duì)象的success事件和error事件,了解是否寫入成功。

讀取數(shù)據(jù) 

讀取數(shù)據(jù)也是通過事務(wù)完成。

function read() {
   var transaction = db.transaction(['person']);
   var objectStore = transaction.objectStore('person');
   var request = objectStore.get(1);

   request.onerror = function(event) {
     console.log('事務(wù)失敗');
   };

   request.onsuccess = function( event) {
      if (request.result) {
        console.log('Name: ' + request.result.name);
        console.log('Age: ' + request.result.age);
        console.log('Email: ' + request.result.email);
      } else {
        console.log('未獲得數(shù)據(jù)記錄');
      }
   };
}

read();

上面代碼中,objectStore.get()方法用于讀取數(shù)據(jù),參數(shù)是主鍵的值。

遍歷數(shù)據(jù) 

遍歷數(shù)據(jù)表格的所有記錄,要使用指針對(duì)象 IDBCursor。

function readAll() {
  var objectStore = db.transaction('person').objectStore('person');

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

     if (cursor) {
       console.log('Id: ' + cursor.key);
       console.log('Name: ' + cursor.value.name);
       console.log('Age: ' + cursor.value.age);
       console.log('Email: ' + cursor.value.email);
       cursor.continue();
    } else {
      console.log('沒有更多數(shù)據(jù)了!');
    }
  };
}

readAll();

上面代碼中,新建指針對(duì)象的openCursor()方法是一個(gè)異步操作,所以要監(jiān)聽success事件。

更新數(shù)據(jù) 

更新數(shù)據(jù)要使用IDBObject.put()方法。

function update() {
  var request = db.transaction(['person'], 'readwrite')
    .objectStore('person')
    .put({ id: 1, name: '李四', age: 35, email: 'lisi@example.com' });

  request.onsuccess = function (event) {
    console.log('數(shù)據(jù)更新成功');
  };

  request.onerror = function (event) {
    console.log('數(shù)據(jù)更新失敗');
  }
}

update();

上面代碼中,put()方法自動(dòng)更新了主鍵為1的記錄。

刪除數(shù)據(jù) 

IDBObjectStore.delete()方法用于刪除記錄。

function remove() {
  var request = db.transaction(['person'], 'readwrite')
    .objectStore('person')
    .delete(1);

  request.onsuccess = function (event) {
    console.log('數(shù)據(jù)刪除成功');
  };
}

remove();

使用索引 

索引的意義在于,可以讓你搜索任意字段,也就是說從任意字段拿到數(shù)據(jù)記錄。如果不建立索引,默認(rèn)只能搜索主鍵(即從主鍵取值)。

假定新建表格的時(shí)候,對(duì)name字段建立了索引。

objectStore.createIndex('name', 'name', { unique: false });

現(xiàn)在,就可以從name找到對(duì)應(yīng)的數(shù)據(jù)記錄了。

var transaction = db.transaction(['person'], 'readonly');
var store = transaction.objectStore('person');
var index = store.index('name');
var request = index.get('李四');

request.onsuccess = function (e) {
  var result = e.target.result;
  if (result) {
    // ...
  } else {
    // ...
  }
}

indexedDB 對(duì)象 

瀏覽器原生提供indexedDB對(duì)象,作為開發(fā)者的操作接口。

indexedDB.open() 

indexedDB.open()方法用于打開數(shù)據(jù)庫。這是一個(gè)異步操作,但是會(huì)立刻返回一個(gè) IDBOpenDBRequest 對(duì)象。

var openRequest = window.indexedDB.open('test', 1);

上面代碼表示,打開一個(gè)名為test、版本為1的數(shù)據(jù)庫。如果該數(shù)據(jù)庫不存在,則會(huì)新建該數(shù)據(jù)庫。

open()方法的第一個(gè)參數(shù)是數(shù)據(jù)庫名稱,格式為字符串,不可省略;第二個(gè)參數(shù)是數(shù)據(jù)庫版本,是一個(gè)大于0的正整數(shù)(0將報(bào)錯(cuò)),如果該參數(shù)大于當(dāng)前版本,會(huì)觸發(fā)數(shù)據(jù)庫升級(jí)。第二個(gè)參數(shù)可省略,如果數(shù)據(jù)庫已存在,將打開當(dāng)前版本的數(shù)據(jù)庫;如果數(shù)據(jù)庫不存在,將創(chuàng)建該版本的數(shù)據(jù)庫,默認(rèn)版本為1。

打開數(shù)據(jù)庫是異步操作,通過各種事件通知客戶端。下面是有可能觸發(fā)的4種事件。

  • success:打開成功。
  • error:打開失敗。
  • upgradeneeded:第一次打開該數(shù)據(jù)庫,或者數(shù)據(jù)庫版本發(fā)生變化。
  • blocked:上一次的數(shù)據(jù)庫連接還未關(guān)閉。

第一次打開數(shù)據(jù)庫時(shí),會(huì)先觸發(fā)upgradeneeded事件,然后觸發(fā)success事件。

根據(jù)不同的需要,對(duì)上面4種事件監(jiān)聽函數(shù)。

var openRequest = indexedDB.open('test', 1);
var db;

openRequest.onupgradeneeded = function (e) {
  console.log('Upgrading...');
}

openRequest.onsuccess = function (e) {
  console.log('Success!');
  db = openRequest.result;
}

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

上面代碼有兩個(gè)地方需要注意。首先,open()方法返回的是一個(gè)對(duì)象(IDBOpenDBRequest),監(jiān)聽函數(shù)就定義在這個(gè)對(duì)象上面。其次,success事件發(fā)生后,從openRequest.result屬性可以拿到已經(jīng)打開的IndexedDB數(shù)據(jù)庫對(duì)象。

indexedDB.deleteDatabase() 

indexedDB.deleteDatabase()方法用于刪除一個(gè)數(shù)據(jù)庫,參數(shù)為數(shù)據(jù)庫的名字。它會(huì)立刻返回一個(gè)IDBOpenDBRequest對(duì)象,然后對(duì)數(shù)據(jù)庫執(zhí)行異步刪除。刪除操作的結(jié)果會(huì)通過事件通知,IDBOpenDBRequest對(duì)象可以監(jiān)聽以下事件。

  • success:刪除成功
  • error:刪除報(bào)錯(cuò)
var DBDeleteRequest = window.indexedDB.deleteDatabase('demo');

DBDeleteRequest.onerror = function (event) {
  console.log('Error');
};

DBDeleteRequest.onsuccess = function (event) {
  console.log('success');
};

調(diào)用deleteDatabase()方法以后,當(dāng)前數(shù)據(jù)庫的其他已經(jīng)打開的連接都會(huì)接收到versionchange事件。

注意,刪除不存在的數(shù)據(jù)庫并不會(huì)報(bào)錯(cuò)。

indexedDB.cmp() 

indexedDB.cmp()方法比較兩個(gè)值是否為 indexedDB 的相同的主鍵。它返回一個(gè)整數(shù),表示比較的結(jié)果:0表示相同,1表示第一個(gè)主鍵大于第二個(gè)主鍵,-1表示第一個(gè)主鍵小于第二個(gè)主鍵。

window.indexedDB.cmp(1, 2) // -1

注意,這個(gè)方法不能用來比較任意的 JavaScript 值。如果參數(shù)是布爾值或?qū)ο?,它?huì)報(bào)錯(cuò)。

window.indexedDB.cmp(1, true) // 報(bào)錯(cuò)
window.indexedDB.cmp({}, {}) // 報(bào)錯(cuò)

IDBRequest 對(duì)象 

IDBRequest 對(duì)象表示打開的數(shù)據(jù)庫連接,indexedDB.open()方法和indexedDB.deleteDatabase()方法會(huì)返回這個(gè)對(duì)象。數(shù)據(jù)庫的操作都是通過這個(gè)對(duì)象完成的。

這個(gè)對(duì)象的所有操作都是異步操作,要通過readyState屬性判斷是否完成,如果為pending就表示操作正在進(jìn)行,如果為done就表示操作完成,可能成功也可能失敗。

操作完成以后,觸發(fā)success事件或error事件,這時(shí)可以通過result屬性和error屬性拿到操作結(jié)果。如果在pending階段,就去讀取這兩個(gè)屬性,是會(huì)報(bào)錯(cuò)的。

IDBRequest 對(duì)象有以下屬性。

  • IDBRequest.readyState:等于pending表示操作正在進(jìn)行,等于done表示操作正在完成。
  • IDBRequest.result:返回請(qǐng)求的結(jié)果。如果請(qǐng)求失敗、結(jié)果不可用,讀取該屬性會(huì)報(bào)錯(cuò)。
  • IDBRequest.error:請(qǐng)求失敗時(shí),返回錯(cuò)誤對(duì)象。
  • IDBRequest.source:返回請(qǐng)求的來源(比如索引對(duì)象或 ObjectStore)。
  • IDBRequest.transaction:返回當(dāng)前請(qǐng)求正在進(jìn)行的事務(wù),如果不包含事務(wù),返回null。
  • IDBRequest.onsuccess:指定success事件的監(jiān)聽函數(shù)。
  • IDBRequest.onerror:指定error事件的監(jiān)聽函數(shù)。

IDBOpenDBRequest 對(duì)象繼承了 IDBRequest 對(duì)象,提供了兩個(gè)額外的事件監(jiān)聽屬性。

  • IDBOpenDBRequest.onblocked:指定blocked事件(upgradeneeded事件觸發(fā)時(shí),數(shù)據(jù)庫仍然在使用)的監(jiān)聽函數(shù)。
  • IDBOpenDBRequest.onupgradeneededupgradeneeded事件的監(jiān)聽函數(shù)。

IDBDatabase 對(duì)象 

打開數(shù)據(jù)成功以后,可以從IDBOpenDBRequest對(duì)象的result屬性上面,拿到一個(gè)IDBDatabase對(duì)象,它表示連接的數(shù)據(jù)庫。后面對(duì)數(shù)據(jù)庫的操作,都通過這個(gè)對(duì)象完成。

var db;
var DBOpenRequest = window.indexedDB.open('demo', 1);

DBOpenRequest.onerror = function (event) {
  console.log('Error');
};

DBOpenRequest.onsuccess = function(event) {
  db = DBOpenRequest.result;
  // ...
};

屬性 

IDBDatabase 對(duì)象有以下屬性。

  • IDBDatabase.name:字符串,數(shù)據(jù)庫名稱。
  • IDBDatabase.version:整數(shù),數(shù)據(jù)庫版本。數(shù)據(jù)庫第一次創(chuàng)建時(shí),該屬性為空字符串。
  • IDBDatabase.objectStoreNames:DOMStringList 對(duì)象(字符串的集合),包含當(dāng)前數(shù)據(jù)的所有 object store 的名字。
  • IDBDatabase.onabort:指定 abort 事件(事務(wù)中止)的監(jiān)聽函數(shù)。
  • IDBDatabase.onclose:指定 close 事件(數(shù)據(jù)庫意外關(guān)閉)的監(jiān)聽函數(shù)。
  • IDBDatabase.onerror:指定 error 事件(訪問數(shù)據(jù)庫失?。┑谋O(jiān)聽函數(shù)。
  • IDBDatabase.onversionchange:數(shù)據(jù)庫版本變化時(shí)觸發(fā)(發(fā)生upgradeneeded事件,或調(diào)用indexedDB.deleteDatabase())。

下面是objectStoreNames屬性的例子。該屬性返回一個(gè) DOMStringList 對(duì)象,包含了當(dāng)前數(shù)據(jù)庫所有對(duì)象倉庫的名稱(即表名),可以使用 DOMStringList 對(duì)象的contains方法,檢查數(shù)據(jù)庫是否包含某個(gè)對(duì)象倉庫。

if (!db.objectStoreNames.contains('firstOS')) {
  db.createObjectStore('firstOS');
}

上面代碼先判斷某個(gè)對(duì)象倉庫是否存在,如果不存在就創(chuàng)建該對(duì)象倉庫。

方法 

IDBDatabase 對(duì)象有以下方法。

  • IDBDatabase.close():關(guān)閉數(shù)據(jù)庫連接,實(shí)際會(huì)等所有事務(wù)完成后再關(guān)閉。
  • IDBDatabase.createObjectStore():創(chuàng)建存放數(shù)據(jù)的對(duì)象倉庫,類似于傳統(tǒng)關(guān)系型數(shù)據(jù)庫的表格,返回一個(gè) IDBObjectStore 對(duì)象。該方法只能在versionchange事件監(jiān)聽函數(shù)中調(diào)用。
  • IDBDatabase.deleteObjectStore():刪除指定的對(duì)象倉庫。該方法只能在versionchange事件監(jiān)聽函數(shù)中調(diào)用。
  • IDBDatabase.transaction():返回一個(gè) IDBTransaction 事務(wù)對(duì)象。

下面是createObjectStore()方法的例子。

var request = window.indexedDB.open('demo', 2);

request.onupgradeneeded = function (event) {
  var db = event.target.result;

  db.onerror = function(event) {
    console.log('error');
  };

  var objectStore = db.createObjectStore('items');

  // ...
};

上面代碼創(chuàng)建了一個(gè)名為items的對(duì)象倉庫,如果該對(duì)象倉庫已經(jīng)存在,就會(huì)拋出一個(gè)錯(cuò)誤。為了避免出錯(cuò),需要用到下文的objectStoreNames屬性,檢查已有哪些對(duì)象倉庫。

createObjectStore()方法還可以接受第二個(gè)對(duì)象參數(shù),用來設(shè)置對(duì)象倉庫的屬性。

db.createObjectStore('test', { keyPath: 'email' });
db.createObjectStore('test2', { autoIncrement: true });

上面代碼中,keyPath屬性表示主鍵(由于主鍵的值不能重復(fù),所以上例存入之前,必須保證數(shù)據(jù)的email屬性值都是不一樣的),默認(rèn)值為null;autoIncrement屬性表示,是否使用自動(dòng)遞增的整數(shù)作為主鍵(第一個(gè)數(shù)據(jù)記錄為1,第二個(gè)數(shù)據(jù)記錄為2,以此類推),默認(rèn)為false。一般來說,keyPathautoIncrement屬性只要使用一個(gè)就夠了,如果兩個(gè)同時(shí)使用,表示主鍵為遞增的整數(shù),且對(duì)象不得缺少keyPath指定的屬性。

下面是deleteObjectStore()方法的例子。

var dbName = 'sampleDB';
var dbVersion = 2;
var request = indexedDB.open(dbName, dbVersion);

request.onupgradeneeded = function(e) {
  var db = request.result;
  if (e.oldVersion < 1) {
    db.createObjectStore('store1');
  }

  if (e.oldVersion < 2) {
    db.deleteObjectStore('store1');
    db.createObjectStore('store2');
  }

  // ...
};

下面是transaction()方法的例子,該方法用于創(chuàng)建一個(gè)數(shù)據(jù)庫事務(wù),返回一個(gè) IDBTransaction 對(duì)象。向數(shù)據(jù)庫添加數(shù)據(jù)之前,必須先創(chuàng)建數(shù)據(jù)庫事務(wù)。

var t = db.transaction(['items'], 'readwrite');

transaction()方法接受兩個(gè)參數(shù):第一個(gè)參數(shù)是一個(gè)數(shù)組,里面是所涉及的對(duì)象倉庫,通常是只有一個(gè);第二個(gè)參數(shù)是一個(gè)表示操作類型的字符串。目前,操作類型只有兩種:readonly(只讀)和readwrite(讀寫)。添加數(shù)據(jù)使用readwrite,讀取數(shù)據(jù)使用readonly。第二個(gè)參數(shù)是可選的,省略時(shí)默認(rèn)為readonly模式。

IDBObjectStore 對(duì)象 

IDBObjectStore 對(duì)象對(duì)應(yīng)一個(gè)對(duì)象倉庫(object store)。IDBDatabase.createObjectStore()方法返回的就是一個(gè) IDBObjectStore 對(duì)象。

IDBDatabase 對(duì)象的transaction()返回一個(gè)事務(wù)對(duì)象,該對(duì)象的objectStore()方法返回 IDBObjectStore 對(duì)象,因此可以采用下面的鏈?zhǔn)綄懛ā?/p>

db.transaction(['test'], 'readonly')
  .objectStore('test')
  .get(X)
  .onsuccess = function (e) {}

屬性 

IDBObjectStore 對(duì)象有以下屬性。

  • IDBObjectStore.indexNames:返回一個(gè)類似數(shù)組的對(duì)象(DOMStringList),包含了當(dāng)前對(duì)象倉庫的所有索引。
  • IDBObjectStore.keyPath:返回當(dāng)前對(duì)象倉庫的主鍵。
  • IDBObjectStore.name:返回當(dāng)前對(duì)象倉庫的名稱。
  • IDBObjectStore.transaction:返回當(dāng)前對(duì)象倉庫所屬的事務(wù)對(duì)象。
  • IDBObjectStore.autoIncrement:布爾值,表示主鍵是否會(huì)自動(dòng)遞增。

方法 

IDBObjectStore 對(duì)象有以下方法。

(1)IDBObjectStore.add()

IDBObjectStore.add()用于向?qū)ο髠}庫添加數(shù)據(jù),返回一個(gè) IDBRequest 對(duì)象。該方法只用于添加數(shù)據(jù),如果主鍵相同會(huì)報(bào)錯(cuò),因此更新數(shù)據(jù)必須使用put()方法。

objectStore.add(value, key)

該方法接受兩個(gè)參數(shù),第一個(gè)參數(shù)是鍵值,第二個(gè)參數(shù)是主鍵,該參數(shù)可選,如果省略默認(rèn)為null

創(chuàng)建事務(wù)以后,就可以獲取對(duì)象倉庫,然后使用add()方法往里面添加數(shù)據(jù)了。

var db;
var DBOpenRequest = window.indexedDB.open('demo', 1);

DBOpenRequest.onsuccess = function (event) {
  db = DBOpenRequest.result;
  var transaction = db.transaction(['items'], 'readwrite');

  transaction.oncomplete = function (event) {
    console.log('transaction success');
  };

  transaction.onerror = function (event) {
    console.log('transaction error: ' + transaction.error);
  };

  var objectStore = transaction.objectStore('items');
  var objectStoreRequest = objectStore.add({ foo: 1 });

  objectStoreRequest.onsuccess = function (event) {
    console.log('add data success');
  };

};

(2)IDBObjectStore.put()

IDBObjectStore.put()方法用于更新某個(gè)主鍵對(duì)應(yīng)的數(shù)據(jù)記錄,如果對(duì)應(yīng)的鍵值不存在,則插入一條新的記錄。該方法返回一個(gè) IDBRequest 對(duì)象。

objectStore.put(item, key)

該方法接受兩個(gè)參數(shù),第一個(gè)參數(shù)為新數(shù)據(jù),第二個(gè)參數(shù)為主鍵,該參數(shù)可選,且只在自動(dòng)遞增時(shí)才有必要提供,因?yàn)槟菚r(shí)主鍵不包含在數(shù)據(jù)值里面。

(3)IDBObjectStore.clear()

IDBObjectStore.clear()刪除當(dāng)前對(duì)象倉庫的所有記錄。該方法返回一個(gè) IDBRequest 對(duì)象。

objectStore.clear()

該方法不需要參數(shù)。

(4)IDBObjectStore.delete()

IDBObjectStore.delete()方法用于刪除指定主鍵的記錄。該方法返回一個(gè) IDBRequest 對(duì)象。

objectStore.delete(Key)

該方法的參數(shù)為主鍵的值。

(5)IDBObjectStore.count()

IDBObjectStore.count()方法用于計(jì)算記錄的數(shù)量。該方法返回一個(gè) IDBRequest 對(duì)象。

IDBObjectStore.count(key)

不帶參數(shù)時(shí),該方法返回當(dāng)前對(duì)象倉庫的所有記錄數(shù)量。如果主鍵或 IDBKeyRange 對(duì)象作為參數(shù),則返回對(duì)應(yīng)的記錄數(shù)量。

(6)IDBObjectStore.getKey()

IDBObjectStore.getKey()用于獲取主鍵。該方法返回一個(gè) IDBRequest 對(duì)象。

objectStore.getKey(key)

該方法的參數(shù)可以是主鍵值或 IDBKeyRange 對(duì)象。

(7)IDBObjectStore.get()

IDBObjectStore.get()用于獲取主鍵對(duì)應(yīng)的數(shù)據(jù)記錄。該方法返回一個(gè) IDBRequest 對(duì)象。

objectStore.get(key)

(8)IDBObjectStore.getAll()

DBObjectStore.getAll()用于獲取對(duì)象倉庫的記錄。該方法返回一個(gè) IDBRequest 對(duì)象。

// 獲取所有記錄
objectStore.getAll()

// 獲取所有符合指定主鍵或 IDBKeyRange 的記錄
objectStore.getAll(query)

// 指定獲取記錄的數(shù)量
objectStore.getAll(query, count)

(9)IDBObjectStore.getAllKeys()

IDBObjectStore.getAllKeys()用于獲取所有符合條件的主鍵。該方法返回一個(gè) IDBRequest 對(duì)象。

// 獲取所有記錄的主鍵
objectStore.getAllKeys()

// 獲取所有符合條件的主鍵
objectStore.getAllKeys(query)

// 指定獲取主鍵的數(shù)量
objectStore.getAllKeys(query, count)

(10)IDBObjectStore.index()

IDBObjectStore.index()方法返回指定名稱的索引對(duì)象 IDBIndex。

objectStore.index(name)

有了索引以后,就可以針對(duì)索引所在的屬性讀取數(shù)據(jù)。

var t = db.transaction(['people'], 'readonly');
var store = t.objectStore('people');
var index = store.index('name');

var request = index.get('foo');

上面代碼打開對(duì)象倉庫以后,先用index()方法指定獲取name屬性的索引,然后用get()方法讀取某個(gè)name屬性(foo)對(duì)應(yīng)的數(shù)據(jù)。如果name屬性不是對(duì)應(yīng)唯一值,這時(shí)get()方法有可能取回多個(gè)數(shù)據(jù)對(duì)象。另外,get()是異步方法,讀取成功以后,只能在success事件的監(jiān)聽函數(shù)中處理數(shù)據(jù)。

(11)IDBObjectStore.createIndex()

IDBObjectStore.createIndex()方法用于新建當(dāng)前數(shù)據(jù)庫的一個(gè)索引。該方法只能在VersionChange監(jiān)聽函數(shù)里面調(diào)用。

objectStore.createIndex(indexName, keyPath, objectParameters)

該方法可以接受三個(gè)參數(shù)。

  • indexName:索引名
  • keyPath:主鍵
  • objectParameters:配置對(duì)象(可選)

第三個(gè)參數(shù)可以配置以下屬性。

  • unique:如果設(shè)為true,將不允許重復(fù)的值
  • multiEntry:如果設(shè)為true,對(duì)于有多個(gè)值的主鍵數(shù)組,每個(gè)值將在索引里面新建一個(gè)條目,否則主鍵數(shù)組對(duì)應(yīng)一個(gè)條目。

假定對(duì)象倉庫中的數(shù)據(jù)記錄都是如下的person類型。

var person = {
  name: name,
  email: email,
  created: new Date()
};

可以指定這個(gè)對(duì)象的某個(gè)屬性來建立索引。

var store = db.createObjectStore('people', { autoIncrement: true });

store.createIndex('name', 'name', { unique: false });
store.createIndex('email', 'email', { unique: true });

上面代碼告訴索引對(duì)象,name屬性不是唯一值,email屬性是唯一值。

(12)IDBObjectStore.deleteIndex()

IDBObjectStore.deleteIndex()方法用于刪除指定的索引。該方法只能在VersionChange監(jiān)聽函數(shù)里面調(diào)用。

objectStore.deleteIndex(indexName)

(13)IDBObjectStore.openCursor()

IDBObjectStore.openCursor()用于獲取一個(gè)指針對(duì)象。

IDBObjectStore.openCursor()

指針對(duì)象可以用來遍歷數(shù)據(jù)。該對(duì)象也是異步的,有自己的successerror事件,可以對(duì)它們指定監(jiān)聽函數(shù)。

var t = db.transaction(['test'], 'readonly');
var store = t.objectStore('test');

var cursor = store.openCursor();

cursor.onsuccess = function (event) {
  var res = event.target.result;
  if (res) {
    console.log('Key', res.key);
    console.dir('Data', res.value);
    res.continue();
  }
}

監(jiān)聽函數(shù)接受一個(gè)事件對(duì)象作為參數(shù),該對(duì)象的target.result屬性指向當(dāng)前數(shù)據(jù)記錄。該記錄的keyvalue分別返回主鍵和鍵值(即實(shí)際存入的數(shù)據(jù))。continue()方法將光標(biāo)移到下一個(gè)數(shù)據(jù)對(duì)象,如果當(dāng)前數(shù)據(jù)對(duì)象已經(jīng)是最后一個(gè)數(shù)據(jù)了,則光標(biāo)指向null。

openCursor()方法的第一個(gè)參數(shù)是主鍵值,或者一個(gè) IDBKeyRange 對(duì)象。如果指定該參數(shù),將只處理包含指定主鍵的記錄;如果省略,將處理所有的記錄。該方法還可以接受第二個(gè)參數(shù),表示遍歷方向,默認(rèn)值為next,其他可能的值為prev、nextuniqueprevunique。后兩個(gè)值表示如果遇到重復(fù)值,會(huì)自動(dòng)跳過。

(14)IDBObjectStore.openKeyCursor()

IDBObjectStore.openKeyCursor()用于獲取一個(gè)主鍵指針對(duì)象。

IDBObjectStore.openKeyCursor()

IDBTransaction 對(duì)象 

IDBTransaction 對(duì)象用來異步操作數(shù)據(jù)庫事務(wù),所有的讀寫操作都要通過這個(gè)對(duì)象進(jìn)行。

IDBDatabase.transaction()方法返回的就是一個(gè) IDBTransaction 對(duì)象。

var db;
var DBOpenRequest = window.indexedDB.open('demo', 1);

DBOpenRequest.onsuccess = function(event) {
  db = DBOpenRequest.result;
  var transaction = db.transaction(['demo'], 'readwrite');

  transaction.oncomplete = function (event) {
    console.log('transaction success');
  };

  transaction.onerror = function (event) {
    console.log('transaction error: ' + transaction.error);
  };

  var objectStore = transaction.objectStore('demo');
  var objectStoreRequest = objectStore.add({ foo: 1 });

  objectStoreRequest.onsuccess = function (event) {
    console.log('add data success');
  };

};

事務(wù)的執(zhí)行順序是按照創(chuàng)建的順序,而不是發(fā)出請(qǐng)求的順序。

var trans1 = db.transaction('foo', 'readwrite');
var trans2 = db.transaction('foo', 'readwrite');
var objectStore2 = trans2.objectStore('foo')
var objectStore1 = trans1.objectStore('foo')
objectStore2.put('2', 'key');
objectStore1.put('1', 'key');

上面代碼中,key對(duì)應(yīng)的鍵值最終是2,而不是1。因?yàn)槭聞?wù)trans1先于trans2創(chuàng)建,所以首先執(zhí)行。

注意,事務(wù)有可能失敗,只有監(jiān)聽到事務(wù)的complete事件,才能保證事務(wù)操作成功。

IDBTransaction 對(duì)象有以下屬性。

  • IDBTransaction.db:返回當(dāng)前事務(wù)所在的數(shù)據(jù)庫對(duì)象 IDBDatabase。
  • IDBTransaction.error:返回當(dāng)前事務(wù)的錯(cuò)誤。如果事務(wù)沒有結(jié)束,或者事務(wù)成功結(jié)束,或者被手動(dòng)終止,該方法返回null
  • IDBTransaction.mode:返回當(dāng)前事務(wù)的模式,默認(rèn)是readonly(只讀),另一個(gè)值是readwrite。
  • IDBTransaction.objectStoreNames:返回一個(gè)類似數(shù)組的對(duì)象 DOMStringList,成員是當(dāng)前事務(wù)涉及的對(duì)象倉庫的名字。
  • IDBTransaction.onabort:指定abort事件(事務(wù)中斷)的監(jiān)聽函數(shù)。
  • IDBTransaction.oncomplete:指定complete事件(事務(wù)成功)的監(jiān)聽函數(shù)。
  • IDBTransaction.onerror:指定error事件(事務(wù)失敗)的監(jiān)聽函數(shù)。

IDBTransaction 對(duì)象有以下方法。

  • IDBTransaction.abort():終止當(dāng)前事務(wù),回滾所有已經(jīng)進(jìn)行的變更。
  • IDBTransaction.objectStore(name):返回指定名稱的對(duì)象倉庫 IDBObjectStore。

IDBIndex 對(duì)象 

IDBIndex 對(duì)象代表數(shù)據(jù)庫的索引,通過這個(gè)對(duì)象可以獲取數(shù)據(jù)庫里面的記錄。數(shù)據(jù)記錄的主鍵默認(rèn)就是帶有索引,IDBIndex 對(duì)象主要用于通過除主鍵以外的其他鍵,建立索引獲取對(duì)象。

IDBIndex 是持久性的鍵值對(duì)存儲(chǔ)。只要插入、更新或刪除數(shù)據(jù)記錄,引用的對(duì)象庫中的記錄,索引就會(huì)自動(dòng)更新。

IDBObjectStore.index()方法可以獲取 IDBIndex 對(duì)象。

var transaction = db.transaction(['contactsList'], 'readonly');
var objectStore = transaction.objectStore('contactsList');
var myIndex = objectStore.index('lName');

myIndex.openCursor().onsuccess = function (event) {
  var cursor = event.target.result;
  if (cursor) {
    var tableRow = document.createElement('tr');
    tableRow.innerHTML =   '<td>' + cursor.value.id + '</td>'
                         + '<td>' + cursor.value.lName + '</td>'
                         + '<td>' + cursor.value.fName + '</td>'
                         + '<td>' + cursor.value.jTitle + '</td>'
                         + '<td>' + cursor.value.company + '</td>'
                         + '<td>' + cursor.value.eMail + '</td>'
                         + '<td>' + cursor.value.phone + '</td>'
                         + '<td>' + cursor.value.age + '</td>';
    tableEntry.appendChild(tableRow);

    cursor.continue();
  } else {
    console.log('Entries all displayed.');
  }
};

IDBIndex 對(duì)象有以下屬性。

  • IDBIndex.name:字符串,索引的名稱。
  • IDBIndex.objectStore:索引所在的對(duì)象倉庫。
  • IDBIndex.keyPath:索引的主鍵。
  • IDBIndex.multiEntry:布爾值,針對(duì)keyPath為數(shù)組的情況,如果設(shè)為true,創(chuàng)建數(shù)組時(shí),每個(gè)數(shù)組成員都會(huì)有一個(gè)條目,否則每個(gè)數(shù)組都只有一個(gè)條目。
  • IDBIndex.unique:布爾值,表示創(chuàng)建索引時(shí)是否允許相同的主鍵。

IDBIndex 對(duì)象有以下方法,它們都是異步的,立即返回的都是一個(gè) IDBRequest 對(duì)象。

  • IDBIndex.count():用來獲取記錄的數(shù)量。它可以接受主鍵或 IDBKeyRange 對(duì)象作為參數(shù),這時(shí)只返回符合主鍵的記錄數(shù)量,否則返回所有記錄的數(shù)量。
  • IDBIndex.get(key):用來獲取符合指定主鍵的數(shù)據(jù)記錄。
  • IDBIndex.getKey(key):用來獲取指定的主鍵。
  • IDBIndex.getAll():用來獲取所有的數(shù)據(jù)記錄。它可以接受兩個(gè)參數(shù),都是可選的,第一個(gè)參數(shù)用來指定主鍵,第二個(gè)參數(shù)用來指定返回記錄的數(shù)量。如果省略這兩個(gè)參數(shù),則返回所有記錄。由于獲取成功時(shí),瀏覽器必須生成所有對(duì)象,所以對(duì)性能有影響。如果數(shù)據(jù)集比較大,建議使用 IDBCursor 對(duì)象。
  • IDBIndex.getAllKeys():該方法與IDBIndex.getAll()方法相似,區(qū)別是獲取所有主鍵。
  • IDBIndex.openCursor():用來獲取一個(gè) IDBCursor 對(duì)象,用來遍歷索引里面的所有條目。
  • IDBIndex.openKeyCursor():該方法與IDBIndex.openCursor()方法相似,區(qū)別是遍歷所有條目的主鍵。

IDBCursor 對(duì)象 

IDBCursor 對(duì)象代表指針對(duì)象,用來遍歷數(shù)據(jù)倉庫(IDBObjectStore)或索引(IDBIndex)的記錄。

IDBCursor 對(duì)象一般通過IDBObjectStore.openCursor()方法獲得。

var transaction = db.transaction(['rushAlbumList'], 'readonly');
var objectStore = transaction.objectStore('rushAlbumList');

objectStore.openCursor(null, 'next').onsuccess = function(event) {
  var cursor = event.target.result;
  if (cursor) {
    var listItem = document.createElement('li');
    listItem.innerHTML = cursor.value.albumTitle + ', ' + cursor.value.year;
    list.appendChild(listItem);

    console.log(cursor.source);
    cursor.continue();
  } else {
    console.log('Entries all displayed.');
  }
};

IDBCursor 對(duì)象的屬性。

  • IDBCursor.source:返回正在遍歷的對(duì)象倉庫或索引。
  • IDBCursor.direction:字符串,表示指針遍歷的方向。共有四個(gè)可能的值:next(從頭開始向后遍歷)、nextunique(從頭開始向后遍歷,重復(fù)的值只遍歷一次)、prev(從尾部開始向前遍歷)、prevunique(從尾部開始向前遍歷,重復(fù)的值只遍歷一次)。該屬性通過IDBObjectStore.openCursor()方法的第二個(gè)參數(shù)指定,一旦指定就不能改變了。
  • IDBCursor.key:返回當(dāng)前記錄的主鍵。
  • IDBCursor.value:返回當(dāng)前記錄的數(shù)據(jù)值。
  • IDBCursor.primaryKey:返回當(dāng)前記錄的主鍵。對(duì)于數(shù)據(jù)倉庫(objectStore)來說,這個(gè)屬性等同于 IDBCursor.key;對(duì)于索引,IDBCursor.key 返回索引的位置值,該屬性返回?cái)?shù)據(jù)記錄的主鍵。

IDBCursor 對(duì)象有如下方法。

  • IDBCursor.advance(n):指針向前移動(dòng) n 個(gè)位置。
  • IDBCursor.continue():指針向前移動(dòng)一個(gè)位置。它可以接受一個(gè)主鍵作為參數(shù),這時(shí)會(huì)跳轉(zhuǎn)到這個(gè)主鍵。
  • IDBCursor.continuePrimaryKey():該方法需要兩個(gè)參數(shù),第一個(gè)是key,第二個(gè)是primaryKey,將指針移到符合這兩個(gè)參數(shù)的位置。
  • IDBCursor.delete():用來刪除當(dāng)前位置的記錄,返回一個(gè) IDBRequest 對(duì)象。該方法不會(huì)改變指針的位置。
  • IDBCursor.update():用來更新當(dāng)前位置的記錄,返回一個(gè) IDBRequest 對(duì)象。它的參數(shù)是要寫入數(shù)據(jù)庫的新的值。

IDBKeyRange 對(duì)象 

IDBKeyRange 對(duì)象代表數(shù)據(jù)倉庫(object store)里面的一組主鍵。根據(jù)這組主鍵,可以獲取數(shù)據(jù)倉庫或索引里面的一組記錄。

IDBKeyRange 可以只包含一個(gè)值,也可以指定上限和下限。它有四個(gè)靜態(tài)方法,用來指定主鍵的范圍。

  • IDBKeyRange.lowerBound():指定下限。
  • IDBKeyRange.upperBound():指定上限。
  • IDBKeyRange.bound():同時(shí)指定上下限。
  • IDBKeyRange.only():指定只包含一個(gè)值。

下面是一些代碼實(shí)例。

// All keys ≤ x
var r1 = IDBKeyRange.upperBound(x);

// All keys < x
var r2 = IDBKeyRange.upperBound(x, true);

// All keys ≥ y
var r3 = IDBKeyRange.lowerBound(y);

// All keys > y
var r4 = IDBKeyRange.lowerBound(y, true);

// All keys ≥ x && ≤ y
var r5 = IDBKeyRange.bound(x, y);

// All keys > x &&< y
var r6 = IDBKeyRange.bound(x, y, true, true);

// All keys > x && ≤ y
var r7 = IDBKeyRange.bound(x, y, true, false);

// All keys ≥ x &&< y
var r8 = IDBKeyRange.bound(x, y, false, true);

// The key = z
var r9 = IDBKeyRange.only(z);

IDBKeyRange.lowerBound()IDBKeyRange.upperBound()、IDBKeyRange.bound()這三個(gè)方法默認(rèn)包括端點(diǎn)值,可以傳入一個(gè)布爾值,修改這個(gè)屬性。

與之對(duì)應(yīng),IDBKeyRange 對(duì)象有四個(gè)只讀屬性。

  • IDBKeyRange.lower:返回下限
  • IDBKeyRange.lowerOpen:布爾值,表示下限是否為開區(qū)間(即下限是否排除在范圍之外)
  • IDBKeyRange.upper:返回上限
  • IDBKeyRange.upperOpen:布爾值,表示上限是否為開區(qū)間(即上限是否排除在范圍之外)

IDBKeyRange 實(shí)例對(duì)象生成以后,將它作為參數(shù)輸入 IDBObjectStore 或 IDBIndex 對(duì)象的openCursor()方法,就可以在所設(shè)定的范圍內(nèi)讀取數(shù)據(jù)。

var t = db.transaction(['people'], 'readonly');
var store = t.objectStore('people');
var index = store.index('name');

var range = IDBKeyRange.bound('B', 'D');

index.openCursor(range).onsuccess = function (e) {
  var cursor = e.target.result;
  if (cursor) {
    console.log(cursor.key + ':');

    for (var field in cursor.value) {
      console.log(cursor.value[field]);
    }
    cursor.continue();
  }
}

IDBKeyRange 有一個(gè)實(shí)例方法includes(key),返回一個(gè)布爾值,表示某個(gè)主鍵是否包含在當(dāng)前這個(gè)主鍵組之內(nèi)。

var keyRangeValue = IDBKeyRange.bound('A', 'K', false, false);

keyRangeValue.includes('F') // true
keyRangeValue.includes('W') // false

參考鏈接 


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)