Dboun

Die dboun-Funktion ist ein Dienstprogramm, das entwickelt wurde, um die Geschwindigkeit zu begrenzen, mit der eine Funktion ausgeführt wird. Es stellt sicher, dass die bereitgestellte Funktion (fn) erst aufgerufen wird, nachdem eine angegebene Verzögerung (Verzögerung) seit dem letzten Aufruf verstrichen ist. Standardmäßig ist die Verzögerung auf 400 Millisekunden eingestellt.

Dies ist besonders nützlich für die Behandlung von Ereignissen, die häufig ausgelöst werden, wie z. B. Größenänderung, Scrollen oder Tippen, indem verhindert wird, dass die bereitgestellte Funktion übermäßig oft aufgerufen wird.

Anwendungsbeispiel

Szenario: Sucheingabe mit Entprellen

// Define the function to handle search
function handleSearch(query: string): void {
    console.log("Searching for:", query);
}

// Create a debounced version of the search handler
const debouncedSearch = dboun(handleSearch, 300);

// Simulate typing in a search box
const input = document.querySelector('#searchBox');
input?.addEventListener('input', (event: Event) => {
    const target = event.target as HTMLInputElement;
    debouncedSearch(target.value);
});

In diesem Beispiel:

• handleSearch ist die Funktion, die die Suchlogik verwaltet.
• debouncedSearch stellt sicher, dass handleSearch erst nach 300 Millisekunden Inaktivität beim Tippen ausgeführt wird.

Parameter

1. fn (Funktion): Die Funktion, die nach der Entprellverzögerung ausgeführt werden soll.

   • Dies ist die Rückruffunktion, die nach der angegebenen Verzögerung aufgerufen wird.

2. Verzögerung (Zahl, optional): Die Anzahl der Millisekunden, die vor dem Aufruf von fn gewartet werden soll. Der Standardwert beträgt 400 Millisekunden.

   • Dies bestimmt das Entprellintervall.

Rückgaben

Die dboun-Funktion gibt eine neue entprellte Version von fn zurück. Die zurückgegebene Funktion verzögert den Aufruf von fn, bis seit dem letzten Aufruf der zurückgegebenen Funktion Millisekunden vergangen sind.

Wie es funktioniert

• Wenn die zurückgegebene Funktion aufgerufen wird, löscht sie alle vorhandenen Timer, die für die Funktion festgelegt sind (clearTimeout(timeout)).
• Ein neuer Timer wird dann eingestellt (setTimeout), um fn nach der angegebenen Verzögerung aufzurufen.
• Wenn die zurückgegebene Funktion vor Ablauf der Verzögerungszeit erneut aufgerufen wird, wird der vorherige Timer gelöscht und zurückgesetzt.

Praktische Anwendungen

1. Eingabeverarbeitung: Entprellen verhindert die übermäßige Ausführung von Event-Handlern, wenn Benutzer in ein Eingabefeld tippen.
2. Größenänderungsereignisse: Verwalten Sie die Leistung, indem Sie Ereignishandler zur Größenänderung von Fenstern entprellen.
3. Scroll-Ereignisse: Vermeiden Sie Leistungsengpässe, indem Sie steuern, wie oft Scroll-Ereignishandler ausgeführt werden.

Notizen

• Wenn Sie eine sofortige Ausführung gefolgt von einer Verzögerung (drosselähnliches Verhalten) benötigen, bietet diese Funktion diese Funktionalität nicht sofort.
• Stellen Sie immer sicher, dass die Verzögerung für den Anwendungsfall angemessen ist, um Reaktionsfähigkeit und Leistung in Einklang zu bringen.

Browserkompatibilität

Die dboun-Funktion nutzt moderne JavaScript/TypeScript-Funktionen und ist somit mit den meisten modernen Umgebungen kompatibel. Erwägen Sie für ältere Umgebungen, den Code zu transpilieren.

Testen

// Test debounced function
const log = dboun((message: string) => console.log(message), 500);
log("Hello"); // Will not log immediately
log("Hello again"); // Resets the timer; only this message will log after 500ms

Das obige ist der detaillierte Inhalt vonDboun. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!