zoukankan      html  css  js  c++  java
  • IndexedDB 封装

    class DB{
        /** 构造函数 */
        constructor(dbName){
            this.dbName = dbName;
        }
        
        /**
         * 选择表单
         */
        table(tableName, keys, version){
            version = version || 1;
            this.tableName = tableName;
            this.request = indexedDB.open(this.dbName, version);
            return new Promise((resolve, reject) => {
                this.request.onsuccess = (event) => {
                    this.db = event.target.result;
                    
                    resolve(this);
                }
                
                this.request.onupgradeneeded = (event) => {
                    this.db = event.target.result;
                    var objectStore;
                    
                    // 排列组合组装索引
                    var groups = [];
                    for(let i=0; i< keys.length; i++){
                        var arr = []; 
                        arr.push([keys[i]]);
                        for(let j=0; j< groups.length; j++){
                            arr.push([...groups[j], keys[i]]);
                        }
                        groups = groups.concat(arr);
                    }
                    if(!this.db.objectStoreNames.contains(tableName)){
                        objectStore = this.db.createObjectStore(tableName, {keyPath: 'id'});
                        groups.forEach(item => {
                            var idx = item.join('_');
                            objectStore.createIndex(idx, item, {unique: false});
                        });
                        
                    }
                    else{
                        objectStore = this.request.transaction.objectStore(tableName);
                        
                        var newIndexNames = [];
                        groups.forEach(item => {
                            var idx = item.join('_');
                            newIndexNames.push(idx);
                            if(!objectStore.indexNames.contains(idx)){
                                objectStore.createIndex(idx, item, {unique: false});
                            }
                        });
                        var delIndexNames = [];
                        for(var i=0; i<objectStore.indexNames.length; i++){
                            var item = objectStore.indexNames.item(i);
                            if(!newIndexNames.includes(item)){
                                delIndexNames.push(item);
                            }    
                        }
                        
                        // 删除索引
                        delIndexNames.forEach(item => {
                            console.log('del:' + item);
                            objectStore.deleteIndex(item);
                        });
            
                    }
                    
                }
                
                this.request.onerror = (event) => {
                    reject(event);
                }
            });
        }
        
    
        
        /**
         * 新增数据
         */
        add(item){
            return new Promise((resolve, reject) => {
                var request = this.db.transaction([this.tableName], 'readwrite')
                .objectStore(this.tableName)
                .add(item);
                
                request.onsuccess = (event) => {
                    resolve(event);
                }
                request.onerror = (event) => {
                    reject(event);
                }
                
            });
        }
        
        /**
         * 通过ID获取
         */
        get(id){
            return new Promise((resolve, reject) => {
                var transaction = this.db.transaction([this.tableName]);
                var objectStore = transaction.objectStore(this.tableName);
                var request = objectStore.get(id);
                request.onsuccess = (event) => {
                    resolve(event.target.result);
                }
                request.onerror = (event) => {
                    reject(event);
                }
            });
        }
        
        /** 获取所有 */
        findAll(){
            return new Promise((resolve, reject) => {
                var transaction = this.db.transaction([this.tableName]);
                var objectStore = transaction.objectStore(this.tableName);
                
                var items = [];
                objectStore.openCursor().onsuccess = async (event) => {
                    var cursor = event.target.result;
                    if(cursor){
                        console.log(cursor);
                        items.push(cursor.value);
                        cursor.continue();
                    }
                    else{
                        resolve(items);
                    }
                    
                }
                
            });
        }
        
        /**
         * 查询列表
         */
        findList(filter){
            return new Promise((resolve, reject) => {
                var keys = Object.keys(filter);
                var values = Object.values(filter);
                
                
                var transaction = this.db.transaction([this.tableName]);
                var objectStore = transaction.objectStore(this.tableName);
                var index = objectStore.index(keys.join('_'));
                
                var items = [];
                
                index.openCursor(IDBKeyRange.only(values)).onsuccess = async (event) => {
                    var cursor = event.target.result;
                    if(cursor){
                        items.push(cursor.value);
                        cursor.continue();
                    }
                    else{
                        resolve(items);
                    }
                    
                }
                
            });
        }
    }
    var db = new DB('TTD');
    db.table('person', ['name', 'age'], 11)
    .then(() => {
        //return db.add({id: 6, name: '王五', age: 25, email: 'zhangsan@email.com'})
    })
    .then(()=>{
        return db.get(11);
    }).then(res => {
        console.log(res);
    }).then(() => {
        return db.findAll();
    }).then(res =>{
        console.log(res);
    }).then(() =>{
        return db.findList({age: 25})
    }).then(res =>{
        console.log(res);
    });
  • 相关阅读:
    进入MFC讲坛的前言(四)
    进入MFC讲坛的前言(二)
    进入MFC讲坛的前言(一)
    进入MFC讲坛的前言(三)
    jar命令+7z:创建,替换,修改,删除Jar, war, ear包中的文件
    java架构之项目结构(entity / DTO / VO)
    面试无忧之Zookeeper总结心得
    BigDecimal.setScale 处理java小数点
    最详细的 paypal 支付接口开发--Java版
    社会化登录分享-Android SDK的二次封装和使用
  • 原文地址:https://www.cnblogs.com/rubekid/p/14679935.html
Copyright © 2011-2022 走看看