二次封裝的緩存框架wCache（支持緩存時間、默認值）--微信小程序

1、前言

開發客戶端時常會用到一些非永久緩存的需求，而微信緩存只能按key永久緩存；其次，當讀取緩存失敗時，有時須要給個默認值，因此得二次判斷下，今天想了一下何不封裝一個緩存框架。

2、支持方法

put(k, v, t)

k爲key，v爲具體內容（支持字符串、json、數組、boolean等等），t爲可選參數表示有效時間（單位：秒）

如存儲k爲123過時時間1秒，則調用put('k', '123', 1)方法；若永久存儲調用put('k', '123')

永久保存json：put('k', {"a":"1"})，數組、boolean等同理。

get(k, def)

k爲key，def爲可選參數，表示無緩存數據時返回值（支持字符串、json、數組、boolean等等）

如讀取k緩存，則調用get('k')；若想要無緩存時，返回默認值則get('k','默認值')，支持各個數據類型。

remove(k)

移除某個key

clear()

清空全部key

其餘方法

使用wx原生的便可。

3、框架講解

put(k, v, t)

var postfix = '_deadtime';
function put(k, v, t) {
  // console.log(k);
  wx.setStorageSync(k, v)
  var seconds = parseInt(t);
  if (seconds > 0) {
    var timestamp = Date.parse(new Date());
    timestamp = timestamp / 1000 + seconds;
    // console.log(timestamp);
    wx.setStorageSync(k + postfix, timestamp + "")
  } else {
    wx.removeStorageSync(k + postfix)
  }
}複製代碼

先存儲key的數據（字符串、數組、json），再判斷過時時間是否大於0，當大於0時，存儲key+一個後綴，內容爲當前時間戳（單位秒）+有效時間t。

get(k, def)

function get(k, def) {
  var deadtime = parseInt(wx.getStorageSync(k + postfix))
  if (deadtime) {
    if (parseInt(deadtime) < Date.parse(new Date()) / 1000) {
      if (def) { return def; } else { return; }
    }
  }
  var res = wx.getStorageSync(k);
  if (res) {
    return res;
  } else {
    return def;
  }
}複製代碼

get方法，先經過key+一個後綴獲得時間戳，若是時間戳存在，切小於當前時間，說明過時；【那麼，當有默認值時返回默認值（包含字符串、數組、json），不然返回空。】當沒過時時，正常讀取key的內容，key存在時正常返回；不然返回默認值，當不存在默認值時返回空。

其餘方法

function remove(k) {
  wx.removeStorageSync(k);
  wx.removeStorageSync(k + postfix);
}

function clear() {
  wx.clearStorageSync();
}複製代碼

remove(k)須要移除2個key，由於存儲的時候，可能存了時間戳，固然即便不存在key，移除也是不會報錯的。

4、如何使用

1. 下載src文件夾內wCache.js文件
2. 須要使用的js文件頭加入var wc = require('../../src/wcache.js')。
3. var s=wc.get('k', '你好')、wc.put('k', 'string你好啊')等;

使用例子

get(e) {
    this.setData({
      text: null
    });
    switch (e.currentTarget.dataset.type) {
      case "def":
        this.setData({
          text: wc.get('k')
        });
        break;
      case "string":
        this.setData({
          text: wc.get('k', '你好')
        });
        break;
      case "json":
        this.setData({
          text: wc.get('k', { "a": "1" })
        });
        break;
    }

  }
  put(e) {
    console.log(e);
    switch (e.currentTarget.dataset.type) {
      case "string":
        wc.put('k', 'string你好啊');
        break;
      case "json":
        wc.put('k', { "b": "3" }, 2);
        break;
      case "list":
        wc.put('k', [1, 2, 3]);
        break;
      case "boolean":
        wc.put('k', true);
        break;
    }
    wx.showToast({
      title: '存儲成功',
      duration: 500,
    })
  }複製代碼

源碼地址：github.com/qq273681448…