函数的防抖和节流就是为了处理一些高频事件的触发次数太多，对网页性能的影响。

    函数的防抖

    定义：当事件被触发一段时间后再执行事件，如果在这阶段时间内事件又被重新触发那么就重新开始计时。

    方法，通过函数的闭包和定时器函数组合生效

    function debounce(fn, time) { //fn:事件处理函数 let t = null; return function() { // 这里的函数第一个参数是事件对象，这里的this是当前操作的元素对象。 clearTimeout(t); //将前面开启的定时器关闭，防止定时器叠加。 t = setTimeout(() => { fn.call(this, arguments[0]); //将this指向事件处理函数里面的this // fn.apply(this, arguments); }, time); } } const search = document.querySelector(‘input’); let num = 0; function thing(e) { //事件处理函数(事件对象，this) num++; console.log(num); console.log(e); //恢复第一次参数是事件对象 console.log(this); //恢复this指向当前操作的元素 } search.oninput = debounce(thing, 1000); // debounce(thing)的结果一定是函数体

    函数的节流

    定义：函数的节流是指在规定的时间内，该事件函数最多只能触发一次，在规定时间内多次触发，不会重新计时；

    方法：通过函数闭包和日期构造函数的时间戳方法（当然也可以是别的自动计时函数）来触发。

    function throttle(fn, time) { //形成闭包 let start = 0; //初始时间 return function() { let current = new Date().getTime(); //获取当前时间的时间戳。 if (current - start >= time) { fn.call(this, arguments[0]); start = current; //将当前时间给起始时间(将获取的当前时间给初始值，继续获取当前时间) } } } const search = document.querySelector(‘input’); let num = 0; function thing(e) { //事件处理函数(事件对象，this) num++; console.log(num); console.log(e); //恢复第一次参数是事件对象 console.log(this); //恢复this指向当前操作的元素 } search.oninput = throttle(thing, 1000); //throttle(thing)的结果一定是函数体