(手写js) 函数防抖|节流实现、Promise实现、Ajax实现

1、手动实现防抖

防抖: 对于频繁触发事件，只在最后一次触发生效
// 非立即防抖：持续触发事件时，事件处理函数完全不执行，等最后一次触发结束一段时间后再执行
// 实现思路：每次触发事件时都取消之前的延时调用方法，并重设定时器
function debounce(wait, funct, ...args) {
    var timer = null
    return () => {
        clearTimeout(timer)
        timer = setTimeout(() => funct(...args), wait)
    }
}

// 立即防抖：持续触发事件时，事件处理函数会立即执行，然后不执行事件处理函数，直至最后一次
//           触发之后的一段时间后才允许再次执行事件处理函数
// 实现思路：判断是否有定时器，没有则执行事件处理函数，然后无论是否有定时器都需重设定时器
function debounce(wait, funct, ...args) {
    var timer = null
    return () => {
        if(!timer)  funct(...args)
        clearTimeout(timer)
        timer = setTimeout(() => timer = null, wait)
    }
}

window.onscroll = debounce(300, (a) => console.log(a), 1)

2、手动实现节流

节流：把频繁触发事件变为少量触发
//时间戳实现：通过时间戳记录上次