From 78fa3400900041e33e2d5bce592c72f52aa47a5b Mon Sep 17 00:00:00 2001
From: = <=>
Date: Sat, 4 May 2024 01:01:47 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E9=A6=96=E6=AC=A1?=
 =?UTF-8?q?=E4=BC=9A=E6=89=A7=E8=A1=8C=E7=9A=84=E9=98=B2=E6=8A=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 html/防抖.html | 22 ++++++++++++++++++++--
 js/防抖.js     | 17 +++++++++++++++++
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/html/防抖.html b/html/防抖.html
index fce9b43..58d53a4 100644
--- a/html/防抖.html
+++ b/html/防抖.html
@@ -9,7 +9,6 @@
   <div>
     <input type="text" id="input">
     <p></p>
-    <input type="button" id="button">
   </div>
   <script>
     function deBounce(fun, delay){
@@ -23,11 +22,30 @@
         },delay)
       }
     }
+
+    function deBounce2(fun, delay){
+      var timer = 0
+      var flag = true // 是否允许执行
+      return function(){
+        var args = arguments
+        var context = this
+        if(flag) {
+          fun.apply(context, args)
+          flag = false
+          return
+        } 
+        clearTimeout(timer)
+        timer = setTimeout(function(){
+          fun.apply(context, args)
+          flag = true
+        },delay)
+      }
+    }
   </script>
   <script type="text/javascript">
     let input = document.querySelector("input")
     let p = document.querySelector("p")
-    input.addEventListener("input", deBounce(function(){
+    input.addEventListener("input", deBounce2(function(){
       p.innerHTML = this.value
     }
     , 250))
diff --git a/js/防抖.js b/js/防抖.js
index c217478..a85e191 100644
--- a/js/防抖.js
+++ b/js/防抖.js
@@ -15,3 +15,20 @@ export default function  deBounce(fun, delay) {
     })
   }
 }
+
+/**
+ * @description 首次执行版本
+ * @param { Function } - 需要添加防抖功能的函数
+ * @delay { number } - 防抖延迟的时间
+ */
+export default function  deBounce(fun, delay) {
+  var timer = 0
+  return function() {
+    var args = arguments
+    var context = this
+    if(timer) clearTimeout(timer)
+    timer = setTimeout(function(){
+      fun.apply(context, args)
+    })
+  }
+}