JavaScript 函数节流

 DOM 操做的交互须要更多的内存和 CPU 时间，连续进行过多的 DOM 相关的操做可能会致使浏览器变慢甚至崩溃，函数节流的设计思想是让某些代码能够在间断的状况下连续重复执行，实现该方法能够使用定时器对该函数进行节流操做;

好比：第一次调用函数的时候，建立一个定时器，在指定的时间间隔下执行代码。当第二次执行的时候，清除前一次的定时器并设置另外一个，将其替换成一个新的定时器;

 

// 以下简单函数节流代码演示
var throttle = {
    timeoutId: null,
    // 须要执行的方法
    preformMethod: function(){
    
    },
    // 初始化须要调用的方法
    process: function(){
        clearTimeout(this.timeoutId);
        var self = this;
        self.timeoutId = setTimeout(function(){
            self.preformMethod();
        },100);
    }
};
// 执行操做
throttle.process();

 

函数节流解决的问题是一些代码 (好比事件) 无间断的执行，这可能会影响浏览器的性能，浏览器变慢或者直接崩溃。好比对于 mouseover 事件或者 click 事件，好比点击 tab 项菜单，无限的点击，有可能会致使浏览器会变慢操做，这时候咱们能够使用函数节流的操做来解决；

 

参考：理解函数节流