loading...
Cover image for S.O.L.I.D. Principles Around You

S.O.L.I.D. Principles Around You

trekhleb profile image Oleksii Trekhleb Updated on ・2 min read

In this article I want to briefly go through SOLID principles (acronym that stands for five basic principles of object-oriented programming and design) supplying each of them with real-world visual examples to make those principles more understandable, readable and memorisable.

If you want to see code examples instead you may take a look at variety of tree data structure implementations in JavaScript like Binary Search Tree, AVL Tree, Red-Black Tree, Segment Tree or Fenwick Tree.

So let’s move on!

S — Single Responsibility Principle

[a.k.a SRP] A class should have only a single responsibility. Only one potential change in the software’s specification should be able to affect the specification of the class.

Single Responsibility Principle

O — Open/Closed Principle

[a.k.a OCP] Software entities should be open for EXTENSION, but closed for MODIFICATION. Allow behaviour to be extended without modifying the source-code.

Open/Closed Principle

L — Liskov Substitution Principle

[a.k.a. LSP] Objects in a program should be replaceable with instances of their subtypes without altering the correctness of that program.

Liskov Substitution Principle

I — Interface Segregation Principle

[a.k.a. ISP] Many client-specific interfaces are better than one general-purpose interface. No client should be forced to depend on methods it does not use.

Interface Segregation Principle

D — Dependency Inversion Principle

[a.k.a. DIP] One should depend upon abstractions, not concretions.

  • High-level modules should not depend on low-level modules. Both should depend on abstractions.
  • Abstractions should not depend on details. Details should depend on abstractions.

Dependency Inversion Principle

The plug doesn’t care which type of wire it uses, it just needs wires that conduct electricity.

I hope these illustration have been useful for you :)

Discussion

pic
Editor guide
Collapse
jwp profile image
John Peters

This is the best explanation of SOLID I've ever seen. Just fantastic, kudos Oleksii!

This would be a wonderful read for many Javascript folks because the principals still apply. It started as an OOD thing, but transcends Object Oriented Design/Programming.

I follow this pattern religiously, especially the first two. It keeps monolithic programming far away as a result. That is always good.

Collapse
trekhleb profile image
Oleksii Trekhleb Author

I agree with you John. Sticking to these principles makes code less fragile and easy to manage as well.

Collapse
jwp profile image
John Peters

Nice meeting you, I'm adding you to my list to Follow, hope we meet again!

Collapse
adamtomat profile image
Adam Tomat

Great article! Love the examples.

Personally I think the DIP example could have been more explicit about “the plug doesn’t care which type of wire it uses, it just needs wires that conduct electricity”

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Good point, Adam! If you don't mind I've just added one more sentence to DIP to reflect the idea from your comment.

Collapse
adamtomat profile image
Adam Tomat

Awesome :)

Collapse
sanchitsanchu profile image
sanchit gupta

Very easy and unique pictorial representation. This would really help me to memorize the principle with real-world examples. I appreciate your efforts.

I have a request :
Can you publish the article with this same pictorial examples of topic design patterns? I often messed up with each other. This would be a great help for me. Thanks in advance.

Collapse
trekhleb profile image
Oleksii Trekhleb Author

I'm glad that you liked it, Sanchit!

Very good idea about making a similar article about design patterns! I can guarantee that I'll write it any time soon, just because of lacking of time, but let me put it in my ToDo list.

Collapse
bennykelly profile image
bennykelly

Hi Oleksii, this is one of the nicest explanations of SOLID I have seen, thank you so much for sharing. I'd love to use these images in a work presentation; however, just want to check that A) you're ok with that and B) what's the best way/your preferred option to credit these images back to you? Thanks again

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Sure, you may re-use these images with the link to the article (dev.to/trekhleb/s-o-l-i-d-principl...) or if it is too long then just use my Twitter link: twitter.com/Trekhleb

Collapse
psaillesh profile image
Saillesh pawar

illustration are amazing and easy to understand.
Thanks for sharing (y)

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Cool! Glad to hear that illustrations help!

Collapse
nikosdev profile image
Nikos Kanakis

This is the best explanation i have ever read about S.O.L.I.D 👏 👏 👏

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Thanks for such words Nikos!

Collapse
ryan_joseph profile image
Ryan Joseph (he/him)

This is incredible!! I've always learned these, then forgot them straight away. This is something that will actually stick! Thank you!

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Cool! I'm glad that it was useful for you!

Collapse
davidyaonz profile image
David Yao

this is one of the best explaining I have ever got. thanks

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Cool! I'm glad that it was clear

Collapse
devarjunan profile image
dev-arjunan

Thank you so much for sharing. I understand clearly.

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Cool! I'm glad that it was useful!

Collapse
mccabiles profile image
Miguel

I never was able to grasp the last three principles (LID), but the concrete examples you gave made everything click into place. I'll be sharing this at work tomorrow, thanks Oleksii! 😁

Collapse
trekhleb profile image
Oleksii Trekhleb Author

Cool! I'm glad that those pictures were clear enough!

Collapse
francescoxx profile image
Francesco Ciulla

Very clean! i have an article about those S.O.L.I.D. principles, too :)

Collapse
trekhleb profile image
Oleksii Trekhleb Author

I like that your's one have code examples, Francesco! Well done!

Collapse
sagar profile image
Sagar

Nice article 🙂