zoukankan      html  css  js  c++  java
  • [Javascript] Broadcaster + Operator + Listener pattern -- 13. Repeat When Done with a Repeat Operator

    Apps often have scenarios where one event controls another. In operators, this requires passing one broadcaster in and using it to control another broadcaster. You can think, "when this broadcaster fires, do that with the other broadcaster". This lesson covers using one broadcaster to control when another broadcaster repeats.

    import { addListener, done, forOf } from "./broadcasters";
    
    const log = console.log;
    
    // only when listener receive DONE event
    // then broadcaster should trigger the listener again
    // otherwise, keep emit value
    let repeat = (broadcaster) => (listener) => {
      let cancel;
      let repeatListener = (value) => {
        // when it is doen event
        if (value === done) {
          // because it is repeated event
          // need to cancel previous one
          if (cancel) {
            cancel();
          }
          // broadcaster should trigger the listener again
          cancel = broadcaster(repeatListener);
          return;
        }
        // otherwise, keep emitting value
        listener(value);
      };
      cancel = broadcaster(repeatListener);
    
      return () => cancel();
    };
    
    // Only when 'whenBroadcater' happen then do the repeat logic
    let repeatWhen = (whenBroadcaster) => (mainBroadcaster) => (listener) => {
      let mainCancel;
      let whenCancel;
      let repeatListener = (value) => {
        if (value === done) {
          if (mainCancel) {
            mainCancel();
          }
          whenCancel = whenBroadcaster(() => {
           // cancel previous when broadcaster 
            whenCancel();
            mainCancel = mainBroadcaster(repeatListener);
          });
        }
        listener(value);
      };
      mainCancel = mainBroadcaster(repeatListener);
    
      return () => {
        mainCancel();
        whenCancel();
      };
    };
    
    const inputClick = addListener("#input", "click");
    const printCat = forOf("cat");
    const repeatCatOnClick = repeatWhen(inputClick)(printCat);
    const cancel = repeatCatOnClick(log);
    
    setTimeout(() => {
      cancel();
    }, 3000);
  • 相关阅读:
    Springboot源码 bean的注册
    Vue源码之 watch
    Vue源码之 slot
    Vue computed 的嵌套
    Vue的子组件绑定的方法中传入自定义参数
    Vue源码之 Vue的生命周期
    Vue源码之-----computed
    Vue源码之----为什么Vue中Array的pop,push等方法可以reactive,而Array[0]='a'这样的方法不会reactive?
    ReSharper 8.1支持Visual Studio 2013的特色——超强滚动条
    Python开发环境Wing IDE使用教程:部分调试功能介绍
  • 原文地址:https://www.cnblogs.com/Answer1215/p/13921149.html
Copyright © 2011-2022 走看看