Rename js snippets

snippets/js/s/debounce-function.md

@@ -0,0 +1,35 @@
+---
+title: Debounce function
+type: snippet
+language: javascript
+tags: [function]
+cover: solitude-beach
+excerpt: Creates a debounced function that waits `ms` milliseconds before invoking the provided function again.
+dateModified: 2021-10-13T19:29:39+02:00
+---
+
+Creates a debounced function that delays invoking the provided function until at least `ms` milliseconds have elapsed since its last invocation.
+
+- Each time the debounced function is invoked, clear the current pending timeout with `clearTimeout()`. Use `setTimeout()` to create a new timeout that delays invoking the function until at least `ms` milliseconds have elapsed.
+- Use `Function.prototype.apply()` to apply the `this` context to the function and provide the necessary arguments.
+- Omit the second argument, `ms`, to set the timeout at a default of `0` ms.
+
+```js
+const debounce = (fn, ms = 0) => {
+  let timeoutId;
+  return function(...args) {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(() => fn.apply(this, args), ms);
+  };
+};
+```
+
+```js
+window.addEventListener(
+  'resize',
+  debounce(() => {
+    console.log(window.innerWidth);
+    console.log(window.innerHeight);
+  }, 250)
+); // Will log the window dimensions at most every 250ms
+```