js函数节流

在js里，对dom的操作是一种很昂贵的操作。如果连续尝试过多的dom操作可能会导致浏览器的卡死甚至崩溃，而这些操作在实际开发中又很常见：

　　比如，我们定义一个onresize事件，那么只要调整浏览器的大小，就会触发该事件，如果我们在该事件处理程序内部再进行dom操作，这将造成高额的资源消耗

　　又比如，我们点击一个按钮就发送一条ajax请求，如果网络不好，导致请求或回应延迟，用户可能会连续点击按钮，假如前端和后端都不做处理，就可能造成数据重复保存（一般不会出现，后端通常也会做处理）

为了解决这种可能的连续操作，我们有了一个函数节流的概念--Throttle

Throttle的基本思想是：

　　在第一次调用函数时创建一个定时器，在指定的时间间隔后执行代码；如果在时间间隔内再次调用throttle函数，会清空原来的定时器，重置一个定时器；

原理其实很简单，直接看代码：

    var btn = document.getElementById("btn");

    function throttle (method ,context) {
        clearTimeout(method.tID);
        method.tID = setTimeout (function () {
            method.call(context);
        }, 1000);
    }

    function say () {
        console.log("按钮被点击了");
    }

    btn.addEventListener('click',function() {
        throttle(say);
    });

在上述代码中，throttle创建了一个定时器，在1秒后调用say方法，如果点了按钮后，不到1秒后又点击了按钮，那么throttle会清空原来的定时器，重新创建一个定时器，1秒后调用say方法，从而保证了1秒内无法重复调用say方法