防抖(debounce)

防抖(debounce)

// npm 節流去抖工具包 throttle-debounce
防抖(debounce)：指的是某個函數在某個時間段內，無論觸發多少次，都只執行最後一次。

代碼如下：

function debounce(fn, wait=100) {
	// 設定定時器
	let timer = null;

	return function(...args) {
		if(timer) {
			clearTimeout(timer);
		}

		timer = setTimeout(() => {
			fn.apply(this, args)
		}, wait);
	}
}

// 定義一個實例接收
const bus = debounce(() => {
	const node = document.createElement("span");
	const textNode = document.createTextNode("?");
	node.appendChild(textNode);
	document.getElementById("debounceImg").appendChild(node);
	console.log("有人上車了, 請再等一等！");
}, 1000);

document.getElementById("debounce").addEventListener("scroll", bus);