All 10 Design Patterns in JavaScript questions
More in Design Patterns in JavaScript
How is the Decorator pattern typically implemented in JavaScript? What is the Strategy pattern and how does it help avoid large if/else chains? How do you implement the Proxy pattern using JavaScript's built-in Proxy object? What is the Command pattern and where is it useful in JavaScript apps? When is it a mistake to force a 'classic' design pattern into idiomatic JavaScript?
Advertisement
Back to results for “Classes & Class Syntax”
JavaScript › Design Patterns in JavaScript

What is the Adapter pattern and why is it useful when integrating third-party code?

Advanced

Answer

Adapter wraps an incompatible interface with a new one that matches what your code expects, letting you swap or update the underlying library without rewriting all the code that depends on it.
class LegacyLogger {
  logMessage(msg) { console.log('LEGACY:', msg); }
}
class LoggerAdapter {
  #legacy = new LegacyLogger();
  log(msg) { this.#legacy.logMessage(msg); } // matches modern interface
}
Real-world example Wrapping an old third-party analytics SDK so the rest of the app can call a consistent, modern log() API.

Common follow-ups: How does Adapter differ from Facade, which also 'wraps' something?

Classes & Class Syntax
All 10 Design Patterns in JavaScript questions