当浏览器窗口改变的时候需要改一些内容:
var n=0; function resizehandler(){ console.log(new Date().getTime()); console.log(++n); }; window.onresize=resizehandler;
这样做会导致窗口改变,计算多次;
js函数节流实现:
原理:利用定时器,让函数执行延迟500毫秒,在500毫秒内如果有函数又被调用则删除上一次调用,这次调用500毫秒后执行,如此往复。这样我刚才的代码可以改为
var n=0; function resizehandler(){ console.log(new Date().getTime()); console.log(++n); }; function throttle(method,context){ clearTimeout(method.tId); method.tId=setTimeout(function(){ // method.call(context); method(); },500); }; window.onresize=function(){ throttle(resizehandler,window); };