节流模式

节流模式(Throttle):对重复的业务逻辑进行节流控制,执行最后一次操作并取消其他操作,以提高性能。
实现一个节流器

var throttle = function(){
    var isClear = arguments[0],fn;
    if(typeof isClear === 'boolean'){
        fn = arguments[1];
        fn.__throttleID && clearTimeout(fn.__throttleID);
    }else{
        fn = isClear;
        param = arguments[1];
        var p = extend({
            context :null,
            argus : [],
            time : 300
        },param);
        arguments.callee(true,fn);
        fn.__throttleID = setTimeout(function(){
            fn.apply(p.context,p.args)
        },p.time)
    }
}

构造节流器的思路:第一件事情就是要清除将要执行的函数,传递两个参数(是否清除,执行函数),如果一个参数为true,表明清除将要执行的函数,判断第二个参数有没有计时器句柄,有则清除计时器。第二件事情就是延迟执行函数,传递两个参数执行函数和相关参数,在节流器内部为执行函数绑定一个计时器句柄,保存该执行函数的计时器,相关参数包括执行时的作用域、执行函数的参数、执行函数的延迟执行的时间。
节流器在优化加载,提高性能的问题上有很大作用。DOM操作常常会占用大量的内存资源和CPU处理时间,甚至大量的DOM操作会使得一些浏览器崩溃,由于JS的单线程处理机制,导致DOM操作占用大量资源时会严重堵塞后面重要程序的执行。

设计模式 文章被收录于专栏

设计模式

全部评论

相关推荐

不愿透露姓名的神秘牛友
11-24 20:55
阿里国际 Java工程师 2.7k*16.0
程序员猪皮:没有超过3k的,不太好选。春招再看看
点赞 评论 收藏
分享
喜欢走神的孤勇者练习时长两年半:爱华,信华,等华,黑华
点赞 评论 收藏
分享
点赞 收藏 评论
分享
牛客网
牛客企业服务