Quick intro
This is the first article in a series I am planning to make about Design Patterns in JavaScript. This time we are going to dive into Adapter pattern. Which is one of the simplest but really powerful and underestimated patterns out-there.
We will try and answer few crucial questions and see an example of how Adapter can be utilised in JavaScript application.
What is a Design Pattern?
General idea is as simple as it sounds. Pattern is a repetition of something more than once. Though with Software Design Patterns, it’s a little bit tricky, but the main concept of repetition still applies.
If we try to summarise it in one sentence it will sound like this -
Software Design Pattern is a general solution to a reappearing problem
There is a whole bunch of different design patterns, which people have build-up during few last decades. I can’t stress enough, how much majority of these patterns will simplify your coding life. It’s just incredible. Once you will master at least some of them, you will feel like you code in completely different language.
As an analogy you can imagine a beginner driver, who just earned driving license, he or she knows how to drive, but it’s not efficient and often car breaks because driver has been pushing clutch too hard every time he was accelerating or using breaks wrong when going downhill etc. And suddenly driver has an “Aha moment” — If I use my gears to assist my breaks every time I drive downhill it will help to save pads, and overall health of my car.
Summary for this section is — Design patterns are here to help you to keep your code efficient, healthy and easy to maintain and scale.
JavaScript and Design Patterns
As you may know, JavaScript is a little bit different compared to other programming languages, especially if we talk about OOP. It has its own features, pros & cons. But if we outline most common issues, they would be — lack of strict types and no solid / matured support of OOP.
Because of the qualities we mentioned above, many people assume, that design patterns are not made for JavaScript. Engineers just ignore them as they are not “applicable”.
BUT, do not forget, what we have learnt about what makes Design Pattern as such. It’s simply a concept, of how you architect your application code. If you can’t make use of entire pattern like it’s described in the book, it doesn’t mean you can’t take best of it and adapt, right?
Adapter pattern in JavaScript
Before we dive into Adapter pattern example in JavaScript, let’s define what it is at all. As you probably know from a real domestic world, adapter is used to connect two or more things which can’t be connected with original sockets. Like for example UK plug can’t be used with European socket, so you need an adapter. Same applies to programming — adapter pattern.
The trick is though, that you have to identify that something needs an adapter. Because as you probably know, if you have any experience in coding, especially in JavaScript, people tend to just use everything and everywhere. Eventually codebase end-up being complete mess with loads of 3rd-party dependencies and spaghetti code, which has no any standards.
Adapter is a structural design pattern so it can improve quality and scalability of your code, massively. I will explain how it works in two examples — simple diagram and simple code implementation.
#javascript #web-development #design-pattern
