//频率控制 函数连续调用时,fn 执行频率限定为 1次/waitMs。立即执行
function throttle(waitMs, fn) {
var lastRun = 0;
return function () {
var now = +new Date;
if (now - lastRun > waitMs) {
lastRun = now;
fn.apply(null, arguments);
}
}
} //空闲控制 返回函数连续调用时,空闲时间必须大于或等于 waitMs,fn 才会执行。延迟执行
function debounce(waitMs, fn) {
var lastCall, args, timeout;
return function r() {
lastCall = +new Date;
args = arguments;
if (!timeout) {
timeout = setTimeout(later, waitMs);
}
}; function later() {
var past = +new Date - lastCall;
if (past > waitMs) {
timeout = null;
fn.apply(null, args)
}
else {
timeout = setTimeout(later, waitMs - past + 1)
}
}
} 调用方法如下:
$(window).resize(debounce(100, function(evt){
......
}));
$(document).mousemove(throttle(40, function(evt){
......
}));
 

精简的javascript下throttle和debounce代码的更多相关文章

  1. [JavaScript] 节流(throttle)-防抖(debounce) 不懵圈指北

    网易云课堂 > 微专业 > 前端高级开发工程师 01.前端高级-JavaScript进阶 > 3.函数式编程 Underscore源码分析 > 3.4.3 throttle 与 ...

  2. [概念] js的函数节流和throttle和debounce详解

    js的函数节流和throttle和debounce详解:同样是实现了一个功能,可能有的效率高,有的效率低,这种现象在高耗能的执行过程中区分就比较明显.本章节一个比较常用的提高性能的方式,通常叫做&qu ...

  3. 试议常用Javascript 类库中 throttle 与 debounce 辅助函数的区别

    问题的引出 看过我前面两篇博客的童鞋可能会注意到都谈到了事件处理的优化问题. 在很多应用中,我们需要控制函数执行的频率, 例如 窗口的 resize,窗口的 scroll 等操作,事件触发的频率非常高 ...

  4. C#.Net下的防抖-Debounce和节流阀-Throttle功能实现

    C#下的防抖-Debounce.节流阀-Throttle功能实现 防抖-Debounce 连续的多次调用,只有在调用停止之后的一段时间内不再调用,然后才执行一次处理过程. 节流阀-Throttle 连 ...

  5. javascript中的throttle和debounce

    throttle 我们这里说的throttle就是函数节流的意思.再说的通俗一点就是函数调用的频度控制器,是连续执行时间间隔控制.主要应用的场景比如: 1.鼠标移动,mousemove 事件2.DOM ...

  6. 一些精简的JavaScript代码集合

    日历 创建过去七天的数组,如果将代码中的减号换成加号,你将得到未来7天的数组集合 // 创建过去七天的数组 [...Array(7).keys()].map(days => new Date(D ...

  7. 【 js 性能优化】throttle 与 debounce 节流

    在看 underscore.js 源码的时候,接触到了这样两个方法,很有意思: 我先把实现的代码撂在下面,看不懂的可以先跳过,但是跳过可不是永远跳过哦- 一个是 throttle: _.throttl ...

  8. 【 js 性能优化】【源码学习】underscore throttle 与 debounce 节流

    在看 underscore.js 源码的时候,接触到了这样两个方法,很有意思: 我先把实现的代码撂在下面,看不懂的可以先跳过,但是跳过可不是永远跳过哦- 一个是 throttle: _.throttl ...

  9. throttle和debounce

    遇到的问题 在开发过程中会遇到频率很高的事件或者连续的事件,如果不进行性能的优化,就可能会出现页面卡顿的现象,比如: 鼠标事件:mousemove(拖曳)/mouseover(划过)/mouseWhe ...

随机推荐

  1. Ubuntu 16.04 64位 搭建 node.js NodeJS 环境

    我的系统环境: Ubuntu 16.04 64位 本文内容亲测可用, 请放心食用 使用淘宝镜像 淘宝镜像官网是https://npm.taobao.org/ 使用淘宝镜像前请自行安装好 npm 和 n ...

  2. 程序中使用ajax时,type为put,或者delete时在 IIS上没效果,发生HTTP Error 405.0 - Method Not Allowed

    其实使用put delete  是在创建webapi中基本才会使用. WebDAV 是超文本传输协议 (HTTP) 的一组扩展,为 Internet 上计算机之间的编辑和文件管理提供了标准.利用这个协 ...

  3. error-unable-to-access-the-iis-metabase或者无法加载VS项目中的网站

    参考:http://stackoverflow.com/questions/12859891/error-unable-to-access-the-iis-metabase 1.确定IIS是否安装完整 ...

  4. shell腳本

    1.awk过滤重复行 awk '!a[$0]++{print $0}' 过滤重复行 awk '!a[$1]++{print $1}' 过滤第一列重复行 并只打印第一列 awk '!($1 in a){ ...

  5. js特效2

    侧边栏简单版 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UT ...

  6. 浅谈C语言中结构体的初始化

    转自:http://www.jb51.net/article/37246.htm <代码大全>建议在变量定义的时候进行初始化,但是很多人,特别是新人对结构体或者结构体数组定义是一般不会初始 ...

  7. Could not load file or assembly 'System.ServiceModel.DomainServices.Hosting'.系统找不到指定文件

    项目部署到服务器后出现如下错误信息: Parser Error Message: Could not load file or assembly 'System.ServiceModel.Domain ...

  8. supervisor拉起daemon进程(falcon-agent)测试

    falcon-agent started..., pid= falcon-agent now is running already, pid= falcon-agent now is running ...

  9. UIView--震动效果

    //震动效果- (void)shake:(UIView *)view{ CGRect frame = view.frame; CAKeyframeAnimation *shakeAnimation = ...

  10. java-集合4

    浏览以下内容前,请点击并阅读 声明 对象排序 一个List对象中如果元素类型为String,则其按字母表顺序排序,而如果元素类型为Date,则按照年代排序,那如何判断元素的排序呢?String和Dat ...