面试题

JS===================================

1. 防抖和节流

• 防抖(debounce)：当一段时间内持续触发事件，只会执行最后一次。在延迟时间内，被触发，将刷新延迟时间。 举例：就好像在百度搜索时，每次输入之后都有联想词弹出，这个控制联想词的方法就不可能是输入框内容一改变就触发的，他一定是当你结束输入一段时间之后才会触发。

const debounce = function(fn, delay){
    let timer = null;
    return (...args)=> {
        clearTimeout(timer);	//在此触发时，会清除上次的事件。
        timer = settimeout(()=>{
            fn.apply(this,argus);//fn调用参数
        },delay);
    };
}

• 节流(throttle)：高频次数触发，在指定时间只会执行一次 举例：预定一个函数只有在大于等于执行周期时才执行，周期内调用不执行。就好像你在淘宝抢购某一件限量热卖商品时，你不断点刷新点购买，可是总有一段时间你点上是没有效果，这里就用到了节流，就是怕点的太快导致系统出现bug。

function throttle(fn,delay=500){
	let canrun = true; //可以执行
    return function(){
        if(!canrun) return ;//执行一次延迟时，就会变为false,后面的就会返回空。
        canrun = false;
        settimeout(()=>{
            fn.apply(this,arguments); //argumens相当于下例子的e,每个函数都有，而上面的防抖是箭头函数只能用 ...arg形式来接收参数。
            canrn = true;
        },500);
    };
}
 function sayHi(e) {
     console.log(e.target.innerWidth, e.target.innerHeight);
   }
  window.addEventListener('resize', throttle(sayHi));