浏览器 IndexedDB 简明教程 ( 十六 ) - 使用索引检索数据

通过浏览器 IndexedDB 简明教程 ( 十四 ) - 创建索引章节我们创建了索引，通过浏览器 IndexedDB 简明教程 ( 十五 ) - 获取索引章节我们获取了索引，接下来，我们就可以使用获取到的索引来检索数据

通过浏览器 IndexedDB 简明教程 ( 十三 ) - 索引罗列的 IDBIndex 对象的属性和方法知道，可以通过 IDBIndex.get(key) 在一个索引上检索数据

IDBIndex.get(key)

IDBIndex.get(key) 方法只有一个参数，那就是要检索记录的键，同时返回一个 IDBRequest 对象，并且在一个单独的线程，返回与键相关联的记录

原型如下

IDBIndex.get(key)

范例

例如，我们要检索 city_name 为 北京市 的记录，可以如下

var db;

//先删除
window.indexedDB.deleteDatabase('demo')

const req = window.indexedDB.open('demo');

req.onerror = function (event) {
    console.log('打开数据库失败');
};

req.onsuccess = function (event) {
    console.log('打开数据库成功');
    db = event.target.result;
    var ts = db.transaction( ['city'] ,'readwrite');
    var city_os = ts.objectStore('city');

    city_os.add({city_id:100000,'city_name':'北京'});
    city_os.add({city_id:300000,'city_name':'天津'});

    console.log('往 city 里添加了两条数据');

    var index = city_os.index('city_name');
    var request = index.get('北京');

    request.onsuccess = function (e) {
        var result = e.target.result;
        if (result) {
            console.log('北京市的区号为:' + result.city_name);
        } else {
            console.log('获取数据失败，你要检索的数据不存在');
        }
    }

};

req.onupgradeneeded = function (event) {
    console.log('升级成功');
    db = event.target.result;
    var city_os = db.createObjectStore('city',{keyPath:'city_id'});
    if ( ! city_os.indexNames.contains('city_name')) {
        // 创建一个新的索引 city_name
        city_os.createIndex('city_name', 'city_name', { unique: false });
        console.log('在存储对象 city 上创建了一个索引 city_name');
    }
}

输出结果如下

升级成功
在存储对象 city 上创建了一个索引 city_name
打开数据库成功
往 city 里添加了两条数据
北京市的区号为:100001

如果存在重复的记录

需要注意的是，IDBIndex.get(key) 只会返回单条数据，如果存在多条数据，也只会返回检索到的第一条数据

例如下面的代码

var db;

//先删除
window.indexedDB.deleteDatabase('demo')

const req = window.indexedDB.open('demo');

req.onerror = function (event) {
    console.log('打开数据库失败');
};

req.onsuccess = function (event) {
    console.log('打开数据库成功');
    db = event.target.result;
    var ts = db.transaction( ['city'] ,'readwrite');
    var city_os = ts.objectStore('city');

    city_os.add({city_id:100000,'city_name':'北京'});
    city_os.add({city_id:100001,'city_name':'北京'});
    city_os.add({city_id:300000,'city_name':'天津'});

    console.log('往 city 里添加了两条数据');

    var index = city_os.index('city_name');
    var request = index.get('北京');

    request.onsuccess = function (e) {
        var result = e.target.result;
        if (result) {
            console.log('北京市的区号为:' + result.city_id);
        } else {
            console.log('获取数据失败，你要检索的数据不存在');
        }
    }

};

req.onupgradeneeded = function (event) {
    console.log('升级成功');
    db = event.target.result;
    var city_os = db.createObjectStore('city',{keyPath:'city_id'});
    if ( ! city_os.indexNames.contains('city_name')) {
        // 创建一个新的索引 city_name
        city_os.createIndex('city_name', 'city_name', { unique: false });
        console.log('在存储对象 city 上创建了一个索引 city_name');
    }
}

输出结果如下

升级成功
在存储对象 city 上创建了一个索引 city_name
打开数据库成功
往 city 里添加了两条数据
北京市的区号为:100001