当前位置：Gxlcms > 数据库问题 > websql操作类封装

websql操作类封装

时间：2021-07-01 10:21:17 帮助过：5人阅读

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

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

技术图片 
  1. import { browserVersions } from ‘@/utils/utils.js‘;
  2. class SmpWebSql {
  3.   constructor(options) {
  4.     options = options || {};
  5.     this.database = null;
  6.     this.DateBaseName = options.DateBaseName || ‘RedDB‘;
  7.     this.Version = options.Version || ‘1.0‘;
  8.     this.Description = options.Description || ‘智维离线工单数据库‘;
  9.     this.DataBaseSize = options.DataBaseSize || 2 * 1024 * 1024;
  10.     this.init();
  11.   }
  12.   /**
  13.    * 初始化数据库
  14.    */
  15.   init() {
  16.     this.database = openDatabase(
  17.       this.DateBaseName,
  18.       this.Version,
  19.       this.Description,
  20.       this.DataBaseSize
  21.     );
  22.   }
  23.   /**
  24.    * 批量添加字段
  25.    * @param {*} tableName 表名
  26.    * @param {*} arr 更新的数据    [{key1：value1 , key2 : value2 ...},{key1：value1 , key2 : value2 ...}]
  27.    * @param {*} index BLOG字段所在的索引位置
  28.    * @param {*} isFirst 是否是第一次创建表
  29.    */
  30.   addBlob(tableName, arr, index, isFirst = true) {
  31.     var _db = this.database;
  32.     var _me = this;
  33.     // eslint-disable-next-line promise/param-names
  34.     return new Promise(function(resovle, reject) {
  35.       if (arr == null) {
  36.         return this;
  37.       }
  38.       var keyC = [];
  39.       var keyI = [];
  40.       var _key = ‘‘;
  41.       arr = arr || [];
  42.       if (arr && arr.constructor == Array) {
  43.         for (var i in arr[0]) {
  44.           keyC.push(i);
  45.           keyI.push(i);
  46.         }
  47.         keyC[0] = keyC[0] + ‘ unique‘;
  48.         _key = keyI.join(‘,‘);
  49.         index = index == undefined ? 0 : index;
  50.         keyC[index] = keyC[index] + ‘ BLOB‘;
  51.         // eslint-disable-next-line promise/param-names
  52.         _db.transaction(function(tx, result) {
  53.           // var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
  54.           // console.log(‘csql:‘ + csql);
  55.           if (isFirst == true) {
  56.             tx.executeSql(
  57.               ‘CREATE TABLE IF NOT EXISTS ‘ +
  58.                 tableName +
  59.                 ‘ (‘ +
  60.                 keyC.join(‘,‘) +
  61.                 ‘)‘
  62.             );
  63.           }
  64.           // var sql = "";
  65.           for (var s = 0, _len = arr.length; s < _len; s++) {
  66.             var _value = _me.split(arr[s]);
  67.             // sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
  68.             // console.log("sql:" + sql);
  69.             tx.executeSql(
  70.               ‘INSERT INTO ‘ +
  71.                 tableName +
  72.                 ‘ (‘ +
  73.                 _key +
  74.                 ‘) VALUES (‘ +
  75.                 _value +
  76.                 ‘)‘,
  77.               [],
  78.               function(tx, result) {
  79.                 resovle(result.rowsAffected);
  80.                 console.log(‘添加成功‘ + result.rowsAffected);
  81.               },
  82.               function(tx) {
  83.                 console.error(‘添加失败‘);
  84.                 // eslint-disable-next-line prefer-promise-reject-errors
  85.                 reject(false);
  86.               }
  87.             );
  88.           }
  89.           _key = keyI = keyC = null;
  90.           resovle(arr.length);
  91.         });
  92.       }
  93.     }).catch(error => {
  94.       console.log(‘error :‘, error);
  95.     });
  96.   }
  97.   /**
  98.    * 批量添加字段
  99.    * @param {*} tableName 表名
  100.    * @param {*} arr 更新的数据    [{key1：value1 , key2 : value2 ...},{key1：value1 , key2 : value2 ...}]
  101.    * @param {*} index BLOG字段所在的索引位置
  102.    * @param {*} firstKey firstKey 第一个字段是否是主键（默认是）
  103.    * @param {*} isFirst 是否是第一次创建表
  104.    */
  105.   patchAddBlob(tableName, arr, index, firstKey = true, isFirst = true) {
  106.     var _db = this.database;
  107.     var _me = this;
  108.     // eslint-disable-next-line promise/param-names
  109.     return new Promise(function(resovle, reject) {
  110.       if (arr == null) {
  111.         return this;
  112.       }
  113.       var keyC = [];
  114.       var keyI = [];
  115.       var _key = ‘‘;
  116.       arr = arr || [];
  117.       if (arr && arr.constructor == Array) {
  118.         for (var i in arr[0]) {
  119.           keyC.push(i);
  120.           keyI.push(i);
  121.         }
  122.         if (firstKey) {
  123.           keyC[0] = keyC[0] + ‘ unique‘;
  124.         }
  125.         _key = keyI.join(‘,‘);
  126.         index = index == undefined ? 0 : index;
  127.         keyC[index] = keyC[index] + ‘ text‘;
  128.         // eslint-disable-next-line promise/param-names
  129.         _db.transaction(function(tx, result) {
  130.           // var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
  131.           // console.log(‘csql:‘ + csql);
  132.           if (isFirst == true) {
  133.             tx.executeSql(
  134.               ‘CREATE TABLE IF NOT EXISTS ‘ +
  135.                 tableName +
  136.                 ‘ (‘ +
  137.                 keyC.join(‘,‘) +
  138.                 ‘)‘
  139.             );
  140.           }
  141.           var sql = ‘‘;
  142.           var _values = [];
  143.           for (var s = 0, _len = arr.length; s < _len; s++) {
  144.             _values.push(‘(‘ + _me.split(arr[s]) + ‘)‘);
  145.           }
  146.           sql =
  147.             ‘INSERT INTO ‘ +
  148.             tableName +
  149.             ‘ (‘ +
  150.             _key +
  151.             ‘) VALUES ‘ +
  152.             _values.join(‘,‘);
  153.           // console.log(‘sql:‘ + sql);
  154.           tx.executeSql(
  155.             sql,
  156.             [],
  157.             function(tx, result) {
  158.               resovle(result.rowsAffected);
  159.               // console.log(‘添加成功‘+result.rowsAffected);
  160.             },
  161.             function(tx, error) {
  162.               console.error(‘添加失败‘, tx, error);
  163.               // eslint-disable-next-line prefer-promise-reject-errors
  164.               reject(false);
  165.             }
  166.           );
  167.           _key = keyI = keyC = null;
  168.           resovle(arr.length);
  169.         });
  170.       }
  171.     }).catch(error => {
  172.       console.log(‘error :‘, error);
  173.     });
  174.   }
  175.   /**
  176.    * 批量添加字段 注 ： 数据里面的第一个key 为主键
  177.    * @param {*} tableName 表名
  178.    * @param {*} arr arr 更新的数据    [{key1：value1 , key2 : value2 ...},{key1：value1 , key2 : value2 ...}]
  179.    * @param {*} firstKey firstKey 第一个字段是否是主键（默认是）
  180.    */
  181.   add(tableName, arr, firstKey = true) {
  182.     var _me = this;
  183.     var _db = this.database;
  184.     // eslint-disable-next-line promise/param-names
  185.     return new Promise(function(resovle, reject) {
  186.       if (arr == null) {
  187.         return this;
  188.       }
  189.       var keyC = [];
  190.       var keyI = [];
  191.       var _key = ‘‘;
  192.       arr = arr || [];
  193.       if (arr && arr.constructor == Array) {
  194.         for (var i in arr[0]) {
  195.           keyC.push(i);
  196.           keyI.push(i);
  197.         }
  198.         if (firstKey) {
  199.           keyC[0] = keyC[0] + ‘ unique‘;
  200.         }
  201.         _key = keyI.join(‘,‘);
  202.         _db.transaction(function(tx) {
  203.           // /var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
  204.           // console.log(‘csql:‘ + csql);
  205.           tx.executeSql(
  206.             ‘CREATE TABLE IF NOT EXISTS ‘ +
  207.               tableName +
  208.               ‘ (‘ +
  209.               keyC.join(‘,‘) +
  210.               ‘)‘
  211.           );
  212.           // var sql = "";
  213.           for (var s = 0, _len = arr.length; s < _len; s++) {
  214.             var _value = _me.split(arr[s]);
  215.             // sql += ‘INSERT INTO ‘ + tableName + ‘ (‘ + _key + ‘) VALUES (‘ + _value + ‘)‘;
  216.             // console.log("sql:" + sql);
  217.             tx.executeSql(
  218.               ‘INSERT INTO ‘ +
  219.                 tableName +
  220.                 ‘ (‘ +
  221.                 _key +
  222.                 ‘) VALUES (‘ +
  223.                 _value +
  224.                 ‘)‘,
  225.               [],
  226.               function(tx, result) {
  227.                 resovle(result.rowsAffected);
  228.                 // console.log(‘添加成功‘+result.rowsAffected);
  229.               },
  230.               function(tx, error) {
  231.                 console.error(‘添加失败‘, error);
  232.                 // eslint-disable-next-line prefer-promise-reject-errors
  233.                 reject(false);
  234.               }
  235.             );
  236.           }
  237.           _key = keyI = keyC = null;
  238.           resovle(arr.length);
  239.         });
  240.       }
  241.     }).catch(error => {
  242.       console.log(‘error :‘, error);
  243.     });
  244.   }
  245.   /**
  246.    * 批量添加行记录 注 ： 数据里面的第一个key 为主键
  247.    * @param {*} tableName 表名
  248.    * @param {*} arr arr 更新的数据    [{key1：value1 , key2 : value2 ...},{key1：value1 , key2 : value2 ...}]
  249.    * @param {*} firstKey firstKey 第一个字段是否是主键（默认是）
  250.    */
  251.   patchAdd(tableName, arr, firstKey = true) {
  252.     var _me = this;
  253.     var _db = this.database;
  254.     // eslint-disable-next-line promise/param-names
  255.     return new Promise(function(resovle, reject) {
  256.       if (arr == null) {
  257.         return this;
  258.       }
  259.       var keyC = [];
  260.       var keyI = [];
  261.       var _key = ‘‘;
  262.       arr = arr || [];
  263.       if (arr && arr.constructor == Array) {
  264.         for (var i in arr[0]) {
  265.           keyC.push(i);
  266.           keyI.push(i);
  267.         }
  268.         if (firstKey) {
  269.           keyC[0] = keyC[0] + ‘ unique‘;
  270.         }
  271.         _key = keyI.join(‘,‘);
  272.         _db.transaction(function(tx) {
  273.           // /var csql = ‘CREATE TABLE IF NOT EXISTS ‘ + tableName + ‘ (‘ + keyC.join(",") + ‘)‘;
  274.           // console.log(‘csql:‘ + csql);
  275.           tx.executeSql(
  276.             ‘CREATE TABLE IF NOT EXISTS ‘ +
  277.               tableName +
  278.               ‘ (‘ +
  279.               keyC.join(‘,‘) +
  280.               ‘)‘
  281.           );
  282.           var sql = ‘‘;
  283.           var _values = [];
  284.           for (var s = 0, _len = arr.length; s < _len; s++) {
  285.             _values.push(‘(‘ + _me.split(arr[s]) + ‘)‘);
  286.           }
  287.           sql =
  288.             ‘INSERT INTO ‘ +
  289.             tableName +
  290.             ‘ (‘ +
  291.             _key +
  292.             ‘) VALUES ‘ +
  293.             _values.join(‘,‘);
  294.           console.log(‘sql:‘ + sql);
  295.           tx.executeSql(
  296.             sql,
  297.             [],
  298.             function(tx, result) {
  299.               resovle(result.rowsAffected);
  300.               // console.log(‘添加成功‘+result.rowsAffected);
  301.             },
  302.             function(tx, error) {
  303.               console.error(‘添加失败‘);
  304.               // eslint-disable-next-line prefer-promise-reject-errors
  305.               reject(false);
  306.             }
  307.           );
  308.           _key = keyI = keyC = null;
  309.           resovle(arr.length);
  310.         });
  311.       }
  312.     }).catch(error => {
  313.       console.log(‘error :‘, error);
  314.     });
  315.   }

http://view.szonline.net/yule/26683.html
http://view.szonline.net/gundong/20200530/26682.html
http://view.szonline.net/qiwen/20200530/26681.html
http://view.szonline.net/qiwen/20200530/26680.html
http://view.szonline.net/qiwen/20200530/26679.html
http://view.szonline.net/yule/26678.html
http://view.szonline.net/gundong/20200530/26677.html
http://view.szonline.net/qiwen/20200530/26676.html
http://view.szonline.net/qiwen/20200530/26675.html
http://view.szonline.net/qiwen/20200530/26674.html
http://view.szonline.net/yule/26673.html
http://view.szonline.net/gundong/20200530/26672.html
http://view.szonline.net/qiwen/20200530/26671.html
http://view.szonline.net/qiwen/20200530/26670.html
http://view.szonline.net/qiwen/20200530/26669.html
http://view.szonline.net/yule/26668.html
http://view.szonline.net/gundong/20200530/26667.html
http://view.szonline.net/qiwen/20200530/26666.html
http://view.szonline.net/qiwen/20200530/26665.html
http://view.szonline.net/qiwen/20200530/26664.html
http://view.szonline.net/yule/26662.html
http://view.szonline.net/gundong/20200530/26661.html
http://view.szonline.net/qiwen/20200530/26659.html
http://view.szonline.net/qiwen/20200530/26656.html
http://view.szonline.net/qiwen/20200530/26654.html
http://view.szonline.net/yule/26652.html
http://view.szonline.net/gundong/20200530/26651.html
http://view.szonline.net/qiwen/20200530/26650.html
http://view.szonline.net/qiwen/20200530/26649.html
http://view.szonline.net/qiwen/20200530/26648.html
http://view.szonline.net/yule/26647.html
http://view.szonline.net/gundong/20200530/26646.html
http://view.szonline.net/qiwen/20200530/26645.html
http://view.szonline.net/qiwen/20200530/26644.html
http://view.szonline.net/qiwen/20200530/26643.html
http://view.szonline.net/yule/26642.html
http://view.szonline.net/gundong/20200530/26641.html
http://view.szonline.net/qiwen/20200530/26640.html
http://view.szonline.net/qiwen/20200530/26639.html
http://view.szonline.net/qiwen/20200530/26638.html
http://view.szonline.net/yule/26637.html
http://view.szonline.net/gundong/20200530/26636.html
http://view.szonline.net/qiwen/20200530/26635.html
http://view.szonline.net/qiwen/20200530/26634.html
http://view.szonline.net/qiwen/20200530/26633.html
http://view.szonline.net/yule/26632.html
http://view.szonline.net/gundong/20200530/26631.html
http://view.szonline.net/qiwen/20200530/26630.html
http://view.szonline.net/qiwen/20200530/26629.html
http://view.szonline.net/qiwen/20200530/26628.html
http://view.szonline.net/yule/26627.html
http://view.szonline.net/gundong/20200530/26626.html
http://view.szonline.net/qiwen/20200530/26625.html
http://view.szonline.net/qiwen/20200530/26624.html
http://view.szonline.net/qiwen/20200530/26623.html
http://view.szonline.net/yule/26622.html
http://view.szonline.net/gundong/20200530/26621.html
http://view.szonline.net/qiwen/20200530/26620.html
http://view.szonline.net/qiwen/20200530/26618.html
http://view.szonline.net/qiwen/20200530/26617.html
http://view.szonline.net/yule/26616.html
http://view.szonline.net/gundong/20200530/26615.html
http://view.szonline.net/qiwen/20200530/26614.html
http://view.szonline.net/qiwen/20200530/26613.html
http://view.szonline.net/qiwen/20200530/26612.html
http://view.szonline.net/yule/26611.html
http://view.szonline.net/gundong/20200530/26610.html
http://view.szonline.net/qiwen/20200530/26609.html
http://view.szonline.net/qiwen/20200530/26608.html
http://view.szonline.net/qiwen/20200530/26607.html
http://view.szonline.net/yule/26606.html
http://view.szonline.net/gundong/20200530/26605.html
http://view.szonline.net/qiwen/20200530/26603.html
http://view.szonline.net/qiwen/20200530/26602.html
http://view.szonline.net/qiwen/20200530/26601.html
http://view.szonline.net/yule/26600.html

websql操作类封装

标签：lin   name   catch   es6   esc   import   patch   for   表名   

人气教程排行

本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！