如何编写一个高阶函数用来生成一个防抖函数

1.编写一个函数并多次调用
普通函数

function inner() {
  console.log(" hello ");
}
inner();
inner();

打印了两次

2.这个函数调用两次，但是我们只想打印一次=》将这个函数编写成一个防抖函数
防抖函数

var timer = null;
function inner() {
	clearInterval(timer);
	timer = setTimeout(() => {
		console.log(" hello ");
	}, 1000);
}
inner();
inner();

打印了一次，到这里我们的防抖函数就书写完成了。

3.编写一个函数，可以生成一个防抖的函数
高阶函数

// 1.定义一个高阶函数，可以接收一个函数
function debounce(func, time) {
	
	var timer = null;
	function inner() {
		clearInterval(timer);
		timer = setTimeout(() => {
			func();
		}, time);
	}
	return inner;
}
// 普通函数
function dome() {
	console.log(" hello ");
}
// debounce(dome, 1000) 返回的是inner函数
const newFunc = debounce(dome, 1000);
newFunc();
newFunc();

4.支持普通函数带参数

function debounce(func, time) {
	var timer = null;
	// 因为不知道别人会传入几个参数，为了更好的复用，这里用到了剩余参数
	function inner(...args) {
		clearInterval(timer);
		timer = setTimeout(() => {
			func(...args);
		}, time);
	}
	return inner;
}
function dome(a, b, c) {
	console.log(a, b, c);
}
const newFunc = debounce(dome, 1000);
newFunc(1, 2, 3);
newFunc(4, 5, 6);

打印4,5,6
如果不理解为什么不打印上面的1,2,3,而打印下面的4,5,6。 你可以理解一下什么是防抖。
防抖：当事件被触发的时候，不是立即执行核心代码，而是延迟n秒执行，如果在n秒内事件被再次触发，则重新计时。

5.支持this指向
这里使用.call来改变this指向

 func.call(this, ...args);