websql操作类封装

Posted jiekzou

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了websql操作类封装相关的知识,希望对你有一定的参考价值。

  在之前,我写了一个websql的封装类库,代码如下:

技术图片
(function(win) 
    function smpWebSql(options)
        options = options || ;
        this.database = null;
        this.DateBaseName = options.DateBaseName || ‘SmpDB‘;
        this.Version = options.Version || ‘1.0‘;
        this.Description = options.Description || ‘SmpDB‘;
        this.DataBaseSize = options.DataBaseSize || 2 * 1024 * 1024;
        this.init();
    
    smpWebSql.prototype = 
        init: function() 
            this.database = openDatabase(this.DateBaseName, this.Version, this.Description, this.DataBaseSize); //初始化数据库
        ,
        addBlob: function (tableName, arr,index,isFirst,callback) //批量添加字段
            /*
                注 : 数据里面的第一个key存储类型为BLOB
                @param  tableName 表名
                @param  arr 更新的数据    [key1:value1 , key2 : value2 ...,key1:value1 , key2 : value2 ...]
                @param  index BLOG字段所在的索引位置
                @param  isFirst 是否是第一次创建表
                @param  callback  回调
             */
            if (arr == null) 
                return this;
            
            callback = this.isFunction(callback) ? callback : new Function();
            var _me = this,
                _db = this.database,
                keyC = [],
                keyI = [],
                _key = ‘‘;
            arr = arr || [];
            if (arr && arr.constructor == Array) 
                for (var i in arr[0]) 
                    keyC.push(i);
                    keyI.push(i);
                
                _key = keyI.join(",");
                index = index == undefined ? 0 : index;
                keyC[index] = keyC[index] + ‘ BLOB‘;
                _db.transaction(function (tx, result) 
                    //var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
                    //console.log(‘csql:‘ + csql);
                    if (isFirst == true) 
                        tx.executeSql(‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘);
                    
                    //var sql = "";
                    for (var s = 0, _len = arr.length; s < _len ; s++) 
                        var _value = _me.split(arr[s]);
                        //sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
                        //console.log("sql:" + sql);
                        tx.executeSql(‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘,[],function (tx, result) 
                            callback(result.rowsAffected);
                            //console.log(‘添加成功‘+result.rowsAffected);
                        ,function (tx, error) 
                            console.error(‘添加失败‘);
                            callback(false);
                        );
                    
                    _key = keyI = keyC = null;
                    callback();
                );
            
            return this;
        ,
        add: function (tableName, arr, callback, noKey) //批量添加字段
            /*
                注 : 数据里面的第一个key 为主键
                @param  tableName 表名
                @param  arr 更新的数据    [key1:value1 , key2 : value2 ...,key1:value1 , key2 : value2 ...]
                @param  callback  回调
                @param  noKey 第一个字段是否是主键(默认是)
             */
            if(arr==null)
                return this;
            
            callback = this.isFunction(callback) ? callback : new Function();
            var _me = this,
                _db = this.database,
                keyC = [],
                keyI = [],
                _key = ‘‘;
            arr = arr || [];
            if (arr && arr.constructor == Array) 
                for(var i in arr[0])
                    keyC.push(i);
                    keyI.push(i);
                
                if (noKey==undefined) 
                    keyC[0] = keyC[0] + ‘ unique‘;
                
                _key = keyI.join(",");
                _db.transaction(function (tx) 
                   ///var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
                    // console.log(‘csql:‘ + csql);
                     tx.executeSql(‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘);
                    //var sql = "";
                    for(var s = 0 , _len = arr.length; s < _len ; s++)
                        var _value = _me.split(arr[s]);
                        //sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
                        //console.log("sql:" + sql);
                        tx.executeSql(‘INSERT INTO ‘+tableName+‘ (‘+_key+‘) VALUES (‘+_value+‘)‘,[],function (tx, result) 
                            callback(result.rowsAffected);
                            //console.log(‘添加成功‘+result.rowsAffected);
                        ,function (tx, error) 
                            console.error(‘添加失败‘);
                            callback(false);
                        );
                    
                    _key = keyI = keyC = null;
                    callback();
                );
            
            return this;
        ,
        update : function(tableName,key,value,obj,callback)//更新指定数据
            /*
                @param  tableName 表名
                @param  key 查询的键 
                @param  value 对应键的值
                @param  obj 更新的数据    key1:value1 , key2 : value2 ... 
                @param  callback  回调  传递参数为真则查询成功 反之更新失败
             */
            callback = this.isFunction(callback) ? callback : new Function();
            var _db = this.database,
                _value = this.splitU(obj);
            _db.transaction(function (tx) 
                //console.log(‘sql:‘ + ‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + key + ‘="‘ + value + ‘"‘)
                tx.executeSql(‘UPDATE ‘+tableName+‘ set ‘+_value+‘ where ‘+key+‘="‘+value+‘"‘,[],function (tx, result) 
                    callback(result.rowsAffected);
                ,function (tx, error) 
                    console.error(‘更新失败‘);
                    callback(false);
                );
            );
            return this;
        ,
        updateWhere: function (tableName, where, obj, callback) //更新指定数据
            /*
                @param  tableName 表名
                @param  查询条件 
                @param  obj 更新的数据    key1:value1 , key2 : value2 ... 
                @param  callback  回调  传递参数为真则查询成功 反之更新失败
             */
            callback = this.isFunction(callback) ? callback : new Function();
            var _db = this.database,
                _value = this.splitU(obj);
            _db.transaction(function (tx) 
                console.log(‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + where + ‘"‘)
                tx.executeSql(‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + where + ‘"‘, [], function (tx, result) 
                    callback(result.rowsAffected);
                , function (tx, error) 
                    console.error(‘更新失败‘);
                    callback(false);
                );
            );
            return this;
        ,
        read : function(tableName,condition,callback) //读取表数据
            /*
                @param  tableName 表名
                @param  condition 查询条件   ‘where name="汪文君"‘
                @param  callback  回调  传递参数为真则查询成功 反之查询失败
             */
            var _condition = this.isString(condition) ? condition : ‘‘;
            var _callback = this.isFunction(condition) ? condition : this.isFunction(callback) ? callback : new Function;
            var _db = this.database,
                _me = this,
                _re = [];
                _db.transaction(function (tx) 
                    tx.executeSql(‘SELECT * FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘, [], function (tx, results) 
                        if(results && results.rows)
                            _re =_me.toArray(results.rows);
                            _callback(_re);
                        else
                            _callback([]);
                        
                    ,function(tx,error)
                        _callback([]);
                        console.error(‘查询失败‘);
                    );
                );
                return this;
        ,
        remove:function(tableName,condition,callback)//删除数据
            /*
                @param  tableName 表名
                @param  condition 查询条件   ‘where name="汪文君"‘
                @param  callback  回调  传递参数为真则删除成功 反之删除失败
             */
            var _me = this;
            var _condition = this.isString(condition) ? condition : ‘‘;
            var _callback = this.isFunction(condition) ? condition : this.isFunction(callback) ? callback : new Function;
            _me.database.transaction(function (tx) 
                tx.executeSql(‘DELETE FROM ‘+tableName+ ‘ ‘+ _condition+‘ ‘,[],function (tx, result) 
                    _callback(result.rowsAffected);
                ,function (tx, error) 
                    _callback(false);
                    console.error(‘删除失败‘);
                );
            );
        ,
        counts: function (tableName, condition, callback)  //读取表数据
            /*
                @param  tableName 表名
                @param  condition 查询条件   ‘where name="汪文君"‘
                @param  callback  回调  传递参数为真则查询成功 反之查询失败
             */
            var _condition = this.isString(condition) ? condition : ‘‘;
            var _callback = this.isFunction(condition) ? condition : this.isFunction(callback) ? callback : new Function;
            var _db = this.database,
                _me = this,
                _re = [];
            if (mui.os.ios)  //ios下面特有的
                _db.transaction(function (tx) 
                    tx.executeSql(‘SELECT NO FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘, [], function (tx, results) // count (*) as num
                        if (results && results.rows) 
                            _re = _me.toArray(results.rows);
                            _callback(_re.length);
                         else 
                            _callback(0);
                        
                    , function (tx, error) 
                        _callback(0);
                        console.error(‘查询失败‘);
                    );
                );
             else 
                _db.transaction(function (tx) 
                    tx.executeSql(‘SELECT count (*) as num FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘, [], function (tx, results) // count (*) as num
                        if (results && results.rows) 
                            if (results.rows[0]) 
                                _callback(results.rows[0].num);
                             else 
                                _callback(0);
                            
                         else 
                            _callback(0);
                        
                    , function (tx, error) 
                        _callback(0);
                        console.error(‘查询失败‘);
                    );
                );
            
            return this;
        ,
        delTable:function(tableName,callback) //删除数据表
            callback = this.isFunction(callback) ? callback : new Function();
            this.database.transaction(function(tx)
                tx.executeSql(‘DROP TABLE IF EXISTS ‘+tableName,[],function(tx,res)
                    callback();
                ,function(tx,err)
                    console.error(err);
                );
            );
            return this;
        ,
        splitU: function(obj)//更新字符处理
            var _arr = [];
            for(var t in obj)
                _arr.push(t+‘="‘+obj[t]+‘"‘);
            
            return _arr.join(‘,‘);
        ,
        split : function(obj)//添加字符处理
            var _arr = [];
            for(var m in obj)
                _arr.push("‘"+obj[m]+"‘");
            
            return _arr.join(‘,‘);
        ,
        isFunction : function(callback)
            return typeof callback != ‘undefined‘ && callback.constructor == Function ? true : false
        ,
        isString : function(string)
            return typeof string == ‘string‘ ? true : false
        ,
        toArray : function(obj)
            var _arr = [],
                _len = obj.length;
                if(_len > 0)
                    for (var i = 0; i < _len; i++) 
                        _arr.push(obj.item(i));
                    ;
                
                return _arr;
        
    
    win.smpWebSql = smpWebSql;
(window))
View Code

  上述代码存在的问题非常明显,由于websql操作都是异步操作,当我们为了获取到websql操作的结果之后再进行后续操作时,往往是通过回调函数来实现的,当回调一多的时候,回调地狱就出现了,为了解决回调地狱问题,我将通过Promise来改写,后续调用时,可以直接通过await和async来调用,或者直接通过Promise链式调用也是可以的。

  现在我将通过ES6的语法重写之前的封装类,为了应用ES6中js面向对象的思想,我这里用到了class,最终代码如下:

import utils from ‘@/utils/utils.js‘;
class SmpWebSql 
  constructor(options) 
    options = options || ;
    this.database = null;
    this.DateBaseName = options.DateBaseName || ‘RedDB‘;
    this.Version = options.Version || ‘1.0‘;
    this.Description = options.Description || ‘智维离线工单数据库‘;
    this.DataBaseSize = options.DataBaseSize || 2 * 1024 * 1024;
    this.init();
  
  /**
   * 初始化数据库
   */
  init() 
    this.database = openDatabase(
      this.DateBaseName,
      this.Version,
      this.Description,
      this.DataBaseSize
    );
  
  /**
   * 批量添加字段
   * @param * tableName 表名
   * @param * arr 更新的数据    [key1:value1 , key2 : value2 ...,key1:value1 , key2 : value2 ...]
   * @param * index BLOG字段所在的索引位置
   * @param * isFirst 是否是第一次创建表
   */
  addBlob(tableName, arr, index, isFirst) 
    var _db = this.database;
    var _me = this;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      if (arr == null) 
        return this;
      
      var keyC = [];
      var keyI = [];
      var _key = ‘‘;
      arr = arr || [];
      if (arr && arr.constructor == Array) 
        for (var i in arr[0]) 
          keyC.push(i);
          keyI.push(i);
        
        _key = keyI.join(‘,‘);
        index = index == undefined ? 0 : index;
        keyC[index] = keyC[index] + ‘ BLOB‘;
        // eslint-disable-next-line promise/param-names

        _db.transaction(function(tx, result) 
          // var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
          // console.log(‘csql:‘ + csql);
          if (isFirst == true) 
            tx.executeSql(
              ‘CREATE TABLE IF NOT EXISTS ‘ +
                tableName +
                ‘ (‘ +
                keyC.join(‘,‘) +
                ‘)‘
            );
          
          // var sql = "";
          for (var s = 0, _len = arr.length; s < _len; s++) 
            var _value = _me.split(arr[s]);
            // sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
            // console.log("sql:" + sql);
            tx.executeSql(
              ‘INSERT INTO ‘ +
                tableName +
                ‘ (‘ +
                _key +
                ‘) VALUES (‘ +
                _value +
                ‘)‘,
              [],
              function(tx, result) 
                resovle(result.rowsAffected);
                // console.log(‘添加成功‘+result.rowsAffected);
              ,
              function(tx) 
                console.error(‘添加失败‘);
                // eslint-disable-next-line prefer-promise-reject-errors
                reject(false);
              
            );
          
          _key = keyI = keyC = null;
          resovle();
        );
      
    );
  
  /**
   * 批量添加字段 注 : 数据里面的第一个key 为主键
   * @param * tableName 表名
   * @param * arr arr 更新的数据    [key1:value1 , key2 : value2 ...,key1:value1 , key2 : value2 ...]
   * @param * noKey noKey 第一个字段是否是主键(默认是)
   */
  add(tableName, arr, noKey) 
    var _me = this;
    var _db = this.database;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      if (arr == null) 
        return this;
      
      var keyC = [];
      var keyI = [];
      var _key = ‘‘;
      arr = arr || [];
      if (arr && arr.constructor == Array) 
        for (var i in arr[0]) 
          keyC.push(i);
          keyI.push(i);
        
        if (noKey == undefined) 
          keyC[0] = keyC[0] + ‘ unique‘;
        
        _key = keyI.join(‘,‘);
        _db.transaction(function(tx) 
          // /var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
          // console.log(‘csql:‘ + csql);
          tx.executeSql(
            ‘CREATE TABLE IF NOT EXISTS ‘ +
              tableName +
              ‘ (‘ +
              keyC.join(‘,‘) +
              ‘)‘
          );
          // var sql = "";
          for (var s = 0, _len = arr.length; s < _len; s++) 
            var _value = _me.split(arr[s]);
            // sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
            // console.log("sql:" + sql);
            tx.executeSql(
              ‘INSERT INTO ‘ +
                tableName +
                ‘ (‘ +
                _key +
                ‘) VALUES (‘ +
                _value +
                ‘)‘,
              [],
              function(tx, result) 
                resovle(result.rowsAffected);
                // console.log(‘添加成功‘+result.rowsAffected);
              ,
              function(tx, error) 
                console.error(‘添加失败‘);
                // eslint-disable-next-line prefer-promise-reject-errors
                reject(false);
              
            );
          
          _key = keyI = keyC = null;
          // resovle();
        );
      
    );
  
  /**
   * 更新指定数据
   * @param * tableName 表名
   * @param * key 查询的键
   * @param * value 对应键的值
   * @param * obj obj 更新的数据    key1:value1 , key2 : value2 ...
   */
  update(tableName, key, value, obj) 
    var _db = this.database;
    var _value = this.splitU(obj);
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      _db.transaction(function(tx) 
        // console.log(‘sql:‘ + ‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + key + ‘="‘ + value + ‘"‘)
        tx.executeSql(
          ‘UPDATE ‘ +
            tableName +
            ‘ set ‘ +
            _value +
            ‘ where ‘ +
            key +
            ‘="‘ +
            value +
            ‘"‘,
          [],
          function(tx, result) 
            resovle(result.rowsAffected);
          ,
          function(tx, error) 
            console.error(‘更新失败‘);
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(false);
          
        );
      );
    );
  
  /**
   * 更新指定数据
   * @param * tableName 表名
   * @param * where 查询条件
   * @param * obj obj 更新的数据    key1:value1 , key2 : value2 ...
   */
  updateWhere(tableName, where, obj) 
    var _db = this.database;
    var _value = this.splitU(obj);
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      _db.transaction(function(tx) 
        console.log(
          ‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + where + ‘"‘
        );
        tx.executeSql(
          ‘UPDATE ‘ + tableName + ‘ set ‘ + _value + ‘ where ‘ + where + ‘"‘,
          [],
          function(tx, result) 
            resovle(result.rowsAffected);
          ,
          function(tx, error) 
            console.error(‘更新失败‘);
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(false);
          
        );
      );
    );
  
  /**
   * 读取表数据
   * @param * tableName 表名
   * @param * condition 查询条件   ‘where name="jiekzou"‘
   */
  read(tableName, condition) 
    var _db = this.database;
    var _me = this;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      var _condition = this.isString(condition) ? condition : ‘‘;
      var _re = [];
      _db.transaction(function(tx) 
        tx.executeSql(
          ‘SELECT * FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘,
          [],
          function(tx, results) 
            if (results && results.rows) 
              _re = _me.toArray(results.rows);
              resovle(_re);
             else 
              resovle([]);
            
          ,
          function(tx, error) 
            // eslint-disable-next-line prefer-promise-reject-errors
            reject([]);
            console.error(‘查询失败‘);
          
        );
      );
    );
  
  /**
   * 删除数据
   * @param * tableName 表名
   * @param * condition 查询条件   ‘where name="jiekzou"‘
   */
  remove(tableName, condition) 
    var _me = this;
    var _condition = this.isString(condition) ? condition : ‘‘;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      _me.database.transaction(function(tx) 
        tx.executeSql(
          ‘DELETE FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘,
          [],
          function(tx, result) 
            resovle(result.rowsAffected);
          ,
          function(tx, error) 
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(false);
            console.error(‘删除失败‘);
          
        );
      );
    );
  
  /**
   * 根据查询条件读取表记录数
   * @param * tableName 表名
   * @param * condition 查询条件   ‘where name="jiekzou"‘
   */
  counts(tableName, condition) 
    if (utils.browserVersions.android) 
      return this.androidCounts(tableName, condition);
     else 
      return this.iosCounts(tableName, condition);
    
  
  // ios下面特有的
  /**
   * 读取表数据(ios下面特有的)
   * @param * tableName 表名
   * @param * condition  查询条件   ‘where name="jiekzou"‘
   */
  iosCounts(tableName, condition) 
    var _condition = this.isString(condition) ? condition : ‘‘;
    var _db = this.database;
    var _me = this;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      var _re = [];
      _db.transaction(function(tx) 
        tx.executeSql(
          ‘SELECT NO FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘,
          [],
          function(tx, results) 
            // count (*) as num
            if (results && results.rows) 
              _re = _me.toArray(results.rows);
              resovle(_re.length);
             else 
              resovle(0);
            
          ,
          function(tx, error) 
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(0);
            console.error(‘查询失败‘);
          
        );
      );
    );
  
  /**
   * 读取表数据(Android)
   * @param * tableName 表名
   * @param * condition 查询条件   ‘where name="jiekzou"‘
   */
  androidCounts(tableName, condition) 
    var _condition = this.isString(condition) ? condition : ‘‘;
    var _db = this.database;
    var _me = this;
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      var _re = [];
      _db.transaction(function(tx) 
        tx.executeSql(
          ‘SELECT count (*) as num FROM ‘ + tableName + ‘ ‘ + _condition + ‘ ‘,
          [],
          function(tx, results) 
            // count (*) as num
            if (results && results.rows) 
              if (results.rows[0]) 
                resovle(results.rows[0].num);
               else 
                resovle(0);
              
             else 
              resovle(0);
            
          ,
          function(tx, error) 
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(0);
            console.error(‘查询失败‘);
          
        );
      );
    );
  
  /**
   * 删除数据表
   * @param * tableName 表名
   */
  delTable(tableName) 
    // eslint-disable-next-line promise/param-names
    return new Promise(function(resovle, reject) 
      this.database.transaction(function(tx) 
        tx.executeSql(
          ‘DROP TABLE IF EXISTS ‘ + tableName,
          [],
          function(tx, res) 
            resovle();
          ,
          function(tx, err) 
            console.error(err);
            // eslint-disable-next-line prefer-promise-reject-errors
            reject(0);
          
        );
      );
    );
  
  // 更新字符处理
  splitU(obj) 
    var _arr = [];
    for (var t in obj) 
      _arr.push(t + ‘="‘ + obj[t] + ‘"‘);
    
    return _arr.join(‘,‘);
  
  // 添加字符处理
  split(obj) 
    var _arr = [];
    for (var m in obj) 
      _arr.push(‘\‘‘ + obj[m] + ‘\‘‘);
    
    return _arr.join(‘,‘);
  
  isFunction(callback) 
    return !!(
      typeof callback != ‘undefined‘ && callback.constructor == Function
    );
  
  isString(string) 
    return typeof string == ‘string‘;
  
  toArray(obj) 
    var _arr = [];
    var _len = obj.length;
    if (_len > 0) 
      for (var i = 0; i < _len; i++) 
        _arr.push(obj.item(i));
      
    
    return _arr;
  


export default SmpWebSql;

 

以上是关于websql操作类封装的主要内容,如果未能解决你的问题,请参考以下文章

websql操作类封装

webSQL的基本操作

Websql不适用于phonegap构建

H5操作WebSQL数据库

部分增强Web技术

HBuilder webApp开发 Websql增删改查操作