阻止逻辑事件短时间频繁调用

Question

栗子：阻止按钮在1s内多次被调用; 先上我baidu的结果btn.onclick = function add(){    btn.innerHTML = Number(btn.innerHTML) + 1;        btn.onclick = null;    clearTimeout(timer);    var timer = setTimeout(function(){        btn.onclick = add;    },1000);    }btn.onclick = (function(){    var last = Date.now();    return function(){        var now = Date.now();        if((now - last)>1000){            btn.innerHTML= Number(btn.innerHTML) + 1;                    }        last = now;    }})();以上两种方法都可以实现,目前我困惑的问题在于:1-除了使用定时器或者闭包,有没有更棒的方式;2-如果没有,那么上述两种哪种方式更适合组件化公用;当前项目有许多地方需要用到,那么我想尝试自己封装一个简单的公共方法,达到的效果可以支持click事件阻止1s内被多次调用,又或者可以自定义的扩展(后话);项目基于angular4.x(没有找到类似推迟执行的方法..),当然原生js完全OK

Answer 1

Observable.fromEvent(btn, "click").debounceTime(1000).map().subscribe();

Answer 2

用RxJS的debounceTime啊，你可以用directive包装一下使用