es6裝飾器異步使用

時飛發(fā)布于2019-08-26 10:40 / 2192人閱讀

摘要：裝飾器的寫法是在類或類屬性之前，加個方法名。使用場景突然想到用裝飾器，當(dāng)然是有業(yè)務(wù)需要。但初始化代碼又不歸我控制，且是異步接口請求，不能立即執(zhí)行，這就導(dǎo)致每個函數(shù)都要調(diào)用一遍這個方法。

裝飾器簡介

個人理解，某些場景需要在不改變原有類和屬性的基礎(chǔ)上擴(kuò)展一些功能，所以裝飾器就出現(xiàn)了。

裝飾器的寫法是在類或類屬性之前，加個方法名。學(xué)過java的同學(xué)應(yīng)該比較熟悉這種寫法，Spring中鋪天蓋地都是注解。具體細(xì)節(jié)到處都是，就不贅述了。

不過截止到今天（2019年8月），遺憾的是nodejs還未原生支持，仍然需要babel編譯。

使用場景

突然想到用裝飾器，當(dāng)然是有業(yè)務(wù)需要。寫了一個api類，所有暴露的函數(shù)都需要進(jìn)行一步初始化操作。但初始化代碼又不歸我控制，且是異步接口請求，不能立即執(zhí)行，這就導(dǎo)致每個函數(shù)都要調(diào)用一遍這個init方法。因?yàn)榧恿司彺妫總€都要判斷有沒有緩存，比較惡心。

常用例子

一般用這個日志模塊來舉例，不過它是同步的

class Math {
  @log
  add(a, b) {
    return a + b;
  }
}

function log(target, name, descriptor) {
  var oldValue = descriptor.value;

  descriptor.value = function() {
    console.log(`Calling "${name}" with`, arguments);
    return oldValue.apply(null, arguments);
  };

  return descriptor;
}

const math = new Math();

// passed parameters should get logged now
math.add(2, 4);

修改為異步

let init = 0;
class Maths {
  @log
  add (a, b) {
    return a + b + init;
  }
}

function log (target, name, descriptor) {
  let oldValue = descriptor.value;
  descriptor.value = function (...args) { //有時候，arguments指向不對，可能是babel的鍋？
    console.log(`Calling "${name}" with`, args);
    return new Promise((resolve) => {
      setTimeout(function () {
        // args = [...args, 100];
        init = 100;
        resolve(oldValue.apply(target, args)); //this指向
      }, 100);
    });
  };
  return descriptor;
}

const math = new Maths();

(async () => {
  let a = await math.add(2, 4);
  console.log(a);
})();

在具體函數(shù)前加了裝飾器后，會先執(zhí)行log方法，這樣緩存的變量就修改了。雖然結(jié)果變成異步的，但也滿足我的需要了。