Das Hook-Middleware-Kompositionsmuster

Snippet

Das Hook-Middleware-Kompositionsmuster

Higher-Order-Hooks (Middleware) ermöglichen es, übergreifende Aspekte wie Logging, Analytics oder Caching in bestehende Hooks einzuschleusen, ohne deren interne Logik zu ändern. Dies fördert hochgradig wiederverwendbare und entkoppelte funktionale Logik.

snippet.js
javascript
const withLogging = (useBaseHook) => (args) => {
  const result = useBaseHook(args);
  useEffect(() => {
    console.log('Hook updated:', result);
  }, [result]);
  return result;
};
 
const useLoggedFetch = withLogging(useFetch);

react

Erklärung

const withLogging = (useBaseHook) => (args) => {

Eine Funktion höherer Ordnung, die einen Hook entgegennimmt und einen neuen, erweiterten Hook zurückgibt.

const result = useBaseHook(args);

Führt die ursprüngliche Hook-Logik innerhalb des neuen Hook-Kontexts aus.

Vorheriges Snippet Nächstes Snippet

Mehr JavaScript-Übungen für Experten →

Verwandt

Aus deiner Bibliothek