DEV Community

Cover image for Understanding Dependency Injection in JavaScript

Understanding Dependency Injection in JavaScript

Mohan Murali on December 06, 2021

Dependency Injection is a fairly complex topic for beginners. It might not be necessary to know the concept but knowing it will help you make bette...
Collapse
 
silviumihnea profile image
Silviu-Mihnea Cucuiet

What you describe is not dependency injection, but dependency inversion. You made it so the class Pet does not automatically create a dependency, but rather takes it as a parameter. I think an important bit that you left out is the fact that the instance of the Dog class(fluffy) can be reused in other classes. Good point to specify a purpose for dependency inversion is to create more instances of the dependant class with different dependencies. The bit about the injector is right, dependency injection is a pattern where you don't even need to create any of your services / components / dependencies, but rather let a framework create them for you and figure out the order of the creation and injection of the dependencies. I wish you detailed more on that part.

Collapse
 
_mohanmurali profile image
Mohan Murali

My aim was to make people understand the concept of loose coupling through dependency injection. This is a beginner focused post and don't want to confuse people with information they might not need. Thanks for reading.

Collapse
 
iliashterevgit profile image
ilia-shterev-git

Without being an expert I think that dependency injection is one form of practical application of the dependency inversion.

Collapse
 
jeel profile image
JP

right, agree

Collapse
 
jurijzahn8019 profile image
Jurij Zahn • Edited

I agree with the Author. Js is highly dynamic and powerful so I think it does not really need any kind of IOC. If I pick up the example I will probably end up with something like this:

function whatDoesMyPetSay < T extends { speak: () => string; }>(pet: T): string {
pet.speak();
}

🙂

Collapse
 
_mohanmurali profile image
Mohan Murali

Yes, I agree, You can do it in many ways in JavaScript.

Collapse
 
tanth1993 profile image
tanth1993

many thanks. I've read about "Dependency inversion principle" and I know it clearly after reading your article.
Even though JS doesn't have interface, this is a good, clear and simple example.
in JS files, I usually use export and import some functions into a module, so is it the way could replace DI?

Collapse
 
_mohanmurali profile image
Mohan Murali

Yes, you dont really need to create class objects to use funtions in js. You can directly use functions in most of the case. Glad you liked it.

Collapse
 
essayscambjohn profile image
John Miller

JavaScript also happens to be dynamic in nature.

Collapse
 
ashishnimrot profile image
ashishnimrot

Great

Collapse
 
_mohanmurali profile image
Mohan Murali

Thanks for reading.

Collapse
 
rhodes235 profile image
Sathya

Good read

Collapse
 
_mohanmurali profile image
Mohan Murali

Thanks for reading

Collapse
 
cherif_b profile image
Cherif Bouchelaghem

Dependency injection is passing dependencies as parameters, js supports higher-order functions, so why just don't use partial application and pass functions as dependencies to other functions?

Collapse
 
_mohanmurali profile image
Mohan Murali

Yes, that will indeed be the most optimal way in javascript or any other functional programming language. But DI is very Object oriented concept. If you are working with Class Objects you might be need to use DI. Its all based on situation of use.

Collapse
 
amitabhlaksh profile image
Amitabh Suman

Very nice and easy explanation of not so easy concept. Thanks 👍🏻

Collapse
 
_mohanmurali profile image
Mohan Murali

Thanks, glad you liked it :)