欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

effect返回runner單測(cè)實(shí)現(xiàn)示例詳解

 更新時(shí)間：2022年12月06日 16:21:34   作者：IamZJT_  
這篇文章主要為大家介紹了effect返回runner單測(cè)實(shí)現(xiàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

一、 runner 單測(cè)

首先介紹一下runner的功能，分以下幾點(diǎn):

  • effect(fn)執(zhí)行會(huì)返回一個(gè)runner函數(shù)；
  • 執(zhí)行runner，相當(dāng)于重新執(zhí)行一遍effect里面?zhèn)魅氲?code>fn（原始依賴）；
  • 最后runner的返回值就是fn的返回值。

至于runner的作用，可以看做是對(duì)外暴露ReactiveEffect實(shí)例的run方法。

  • 一方面是為了可以手動(dòng)調(diào)用觸發(fā)依賴；
  • 另一方面，也是為了和stop結(jié)合使用，來(lái)手動(dòng)控制響應(yīng)式的生效與失效；
    具體點(diǎn)就是：使用者可以手動(dòng)執(zhí)行runner()來(lái)控制副作用函數(shù)的生效 和 執(zhí)行stop(runner)也就是runner.effect.stop()使之失效，具體stop的實(shí)現(xiàn)實(shí)現(xiàn)后面再說(shuō)。

還是先來(lái)看一下單測(cè)吧，單測(cè)用例如下：

it('runner', function () {
  // effect(fn) -> return runner -> runner() == fn() -> return
  let foo = 10;
  const runner = effect(() => {
    foo++;
    return 'foo';
  });
  expect(foo).toBe(11);
  const r = runner();
  expect(foo).toBe(12);
  expect(r).toBe('foo');
});

二、 核心邏輯實(shí)現(xiàn)

// + 為新增加的代碼。

class ReactiveEffect {
  private _fn: any;
  constructor(fn) {
    this._fn = fn;
  }
  run() {
    activeEffect = this;
    // + 返回fn的返回值
    return this._fn();
  }
}
export function effect(fn) {
  const _effect = new ReactiveEffect(fn);
  _effect.run();
  // + 涉及到run()中this指向的問(wèn)題，所以需要bind處理一下。
  return _effect.run.bind(_effect);
}

具體實(shí)現(xiàn)較為簡(jiǎn)單，上述代碼中也有相應(yīng)注釋，這里就不再贅述了。
再次完整跑一遍effect單測(cè)，保證新功能的增加對(duì)以往實(shí)現(xiàn)功能不造成影響。

單測(cè)結(jié)果如下：

以上就是effect返回runner單測(cè)實(shí)現(xiàn)示例詳解的詳細(xì)內(nèi)容，更多關(guān)于effect返回runner單測(cè)的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評(píng)論