Need Opinions

#javascript #functional #help

Need opinions:
what is better in JS context composition or inheritance? What should be used when?

Top comments (4)

Raphaël Morineau • Mar 28 '19 • Edited

Composition, always.

Inheritance makes components strongly coupled to their mother "class", effectively making them unusable in a different context (reusability).

With React, you implement common logic into HigherOrderComponents (HoC) which are essentially functions taking any component as parameter, to return it with extended props including the common logic.
More recently, React introduced Hooks which simplifies even more this composition pattern.

With Vue, you can do the same with "mixins", which can be imported into any component, effectively extending their core logic.

Also, writing common logic into small functions makes them highly composable, chainable and reusable with currying, which is more inline with functional programming.

Lastly, a composable HoC/mixin are much easier to unit test, than a "mother class" used in POO.

Aks • Mar 28 '19

Very good points :), but what would be the circumstances we would use inheritance?

Raphaël Morineau • Mar 28 '19

Honestly i never felt the use for it, either in front nor in a Node backend.

A usecase where inheritance could be useful would be, in a big NodeJS-based backend, to create a custom module from another module so you could extend it with your custom methods.
Best example coming to my mind is NestJS, check it out.