Chain of Responsibility Pattern

Question

Accepted Answer

The Chain of Responsibility pattern creates a chain of receiver objects for a request. The request is passed along the chain until an object handles it. This pattern decouples the sender of a request from its receivers, gives multiple objects a chance to handle the request, and allows the chain to be composed dynamically. It's commonly used in middleware pipelines, event handling systems, and validation chains. class Handler { constructor() { this.nextHandler = null; } setNext(handler) { this.nextHandler = handler; return handler; } handle(request) { if (this.nextHandler) { return this.nextHandler.handle(request); } return null; } } class AuthHandler extends Handler { handle(request) { if (!request.token) { return { error: 'Unauthorized' }; } console.log('Auth passed'); return super.handle(request); } } class ValidationHandler extends Handler { handle(request) { if (!request.data || Object.keys(request.data).length === 0) { return { error: 'Invalid request data' }; } console.log('Validation passed'); return super.handle(request); } } class LoggingHandler extends Handler { handle(request) { console.log('Processing request:', request); return super.handle(request); } } // Build chain const chain = new AuthHandler(); chain.setNext(new ValidationHandler()).setNext(new LoggingHandler()); const result = chain.handle({ token: 'valid', data: { id: 1 } }); // Express-style middleware chain const middleware = [ (req, next) => { console.log('Middleware 1'); next(); }, (req, next) => { console.log('Middleware 2'); next(); }, (req, next) => { console.log('Middleware 3'); next(); } ]; function runMiddleware(req, index = 0) { if (index < middleware.length) { middleware[index](req, () => runMiddleware(req, index + 1)); } } // Chain of Responsibility for form validation const validators = [ { validate: (data) => data.email ? null : 'Email is required', name: 'emailRequired' }, { validate: (data) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(data.email) ? null : 'Invalid email format', name: 'emailFormat' }, { validate: (data) => data.password ? null : 'Password is required', name: 'passwordRequired' }, { validate: (data) => data.password.length >= 6 ? null : 'Password must be at least 6 characters', name: 'passwordLength' }, { validate: (data) => data.password === data.confirmPassword ? null : 'Passwords do not match', name: 'passwordMatch' } ]; function useFormValidation(initialData) { const [data, setData] = useState(initialData); const [errors, setErrors] = useState({}); const validateField = (fieldName, value) => { const testData = { ...data, [fieldName]: value }; for (const validator of validators) { const error = validator.validate(testData); if (error && validator.name.includes(fieldName)) { return error; } } return null; }; const validateAll = () => { const newErrors = {}; for (const validator of validators) { const error = validator.validate(data); if (error) { newErrors[validator.name] = error; } } setErrors(newErrors); return Object.keys(newErrors).length === 0; }; const handleChange = (fieldName, value) => { setData(prev => ({ ...prev, [fieldName]: value })); const fieldError = validateField(fieldName, value); setErrors(prev => ({ ...prev, [fieldName]: fieldError })); }; return { data, errors, handleChange, validateAll }; } // React context middleware chain const middlewareChain = []; function useMiddleware(initialState) { const [state, setState] = useState(initialState); const dispatch = async (action) => { let context = { state, action, next: true }; for (const middleware of middlewareChain) { if (!context.next) break; context = await middleware(context); } if (context.next) { setState(prev => reducer(prev, action)); } }; return [state, dispatch]; } // HTTP interceptor (Chain of Responsibility) @Injectable() export class AuthInterceptor implements HttpInterceptor { intercept(req: HttpRequest, next: HttpHandler): Observable> { const authReq = req.clone({ headers: req.headers.set('Authorization', 'Bearer ' + localStorage.getItem('token')) }); return next.handle(authReq); } } @Injectable() export class LoggingInterceptor implements HttpInterceptor { intercept(req: HttpRequest, next: HttpHandler): Observable> { console.log(`Request: ${req.method} ${req.url}`); return next.handle(req).pipe( tap(event => { if (event instanceof HttpResponse) { console.log(`Response: ${event.status}`); } }) ); } } // Custom chain of responsibility for form validation class ValidationHandler { setNext(handler) { this.next = handler; return handler; } validate(control) { return this.next ? this

Chain of Responsibility Pattern

The Chain of Responsibility pattern passes a request along a chain of handlers, allowing multiple objects to handle the request without coupling the sender to a specific receiver.

Chain of Responsibility Pattern

The Chain of Responsibility pattern passes a request along a chain of handlers, allowing multiple objects to handle the request without coupling the sender to a specific receiver.

Scenario Questions

Follow-up Questions