[AskJS] Good References for JS Design Patterns?

[u/Narrow-Low-3137]

Hey everyone 👋

I'm primarily a backend dev that has found myself in a position where I am writing more JavaScript than I ever have. I'm looking for a book or reference analogous to the "big four" design patterns book for C++, but updated for modern JavaScript design patterns/idioms.

Im primarily looking for references in vanilla javascript. Not Typescript or any js frameworks. My thinking is the knowledge should easily transfer over anyway. I'm looking to build a stronger foundation with the language itself.

Any good reference material would be appreciated!

Edit: I should add, I primarily work in the .NET ecosystem, so I don't do js on the backend much.

[u/monotone2k]

but updated for modern JavaScript design patterns/idioms

The great thing about design patterns is that they also apply to JS. There aren't many novel problems that need novel solutions - these things are already solved.

My thinking is the knowledge should easily transfer over anyway

This is exactly why the Gang of Four book is still one of the best - you transfer the knowledge over to whatever language you're using.

[u/Narrow-Low-3137 → u/monotone2k]

I do agree, I think what I'm looking for are good examples of well implemented js I can look at and study a bit. I would say I have a "working knowledge" of js, but I'm trying to improve on that.

[u/kaneda26 → u/Narrow-Low-3137]

I agree that design patterns are generally language agnostic, but I also think that too often people contort patterns into JS in counter productive ways. For example, creating an OOP-style singleton class rather than just exporting an object.

If you already have a good arsenal of patterns, go for a book like How JavaScript Works by Douglas Crockford https://www.amazon.com/dp/1949815005. He breaks down what JS excels at and how to best use its strengths. Though, be warned that Crockford is an eccentric purist with some minorly annoying quirks. But it's a treasure trove of expertise, none-the-less.

[u/Narrow-Low-3137 → u/kaneda26]

Thanks, this looks promising!

[u/Big_Mc-Large-Huge]

JavaScript the Good Parts. It’s the quintessential JS book

[u/CodeAndBiscuits]

Most design patterns can be implemented in JS the same way they can in any other language. The best design patterns aren't language dependent. You could do one in rust, Java, c-sharp, go, and JavaScript and have it work the same way everywhere.

But generally, I think you'll find most folks tend to shy away from them. For a lot of us, JavaScript is an escape from overly opinionated backend oriented approaches. It's not that they don't have value in certain environments, it's more that most JS approaches emphasize simplicity, speed (of development) and not "overbuilding" things.

You'll find some resources out there and some commenters are already replying here with some good ones. And if they make you happy, go for it. Just be prepared for one thing lol. When a lot of us see heavy usage of design patterns, we know immediately the code was written by a backend developer making the transition. There seems to be an irresistible draw to carry over some of the principles they're used to using in other environments to JS when it's just not necessary a lot of the time. There's sort of a fingerprint to it and it's immediately recognizable when you see it. You see a to-do list app example written in 500 lines of code that could have been 10 and you just know. 😀

[u/Narrow-Low-3137 → u/CodeAndBiscuits]

Yeah, I can see that. Mostly what i am trying to do is organize my growing library of JS helpers into reusable modules, reduce code duplication, avoid sending unnecessary js over the wire, get up to speed with modern js practice and patterns. I'm working with custom libraries that are implemented as IIFE mostly at the moment. The front end basicaly razor views with some js I'm trying to refactor.