Dependency Injection

This week I will be talking about a topic that when I first heard it had me, I must admit it was a bit intimidating, but as I read about it, I realized I had been dealing with it for since I started writing JavaScript, I just didn’t know it by its fancy name. That topic is dependency injection.

To explain this term, I think the most straight forward way is to break it up into the two words its made of, dependency being the first. When I hear it, I think of the word dependent. To be dependent, there must be two things that are true, there must be a need and a provider. Like when a child needs to eat, they would likely leave a mess if they were to go and fix it themselves and it would be an error prone process, so an adult goes and provides that service for them. The second word in the term is injection. When I think of injection unfortunately I have bad memories, but the word itself can be as simple as saying putting one thing inside of another thing. Now that we know the words we can begin to understand the term.

function getStuff(youGot, isHappy) {
console.log('You’ve got ' + youGot);
}
getStuff('mail', true);

Have you ever thought of how a function knows what arguments to place where when you call it? This itself is an example of dependency injection. When a function is called it takes a list of the arguments you pass to it, these are the dependencies. When it goes to the definition of that function to determine an output, it takes each parameter in order and relates it to its corresponding position in the list, this process is the injection. So if you’ve ever called a function in JavaScript, you have experience with dependency injection, but now you have a new fancy word to use for it.

function getStuff(youGot, isHappy) {   // ['mail', true]
console.log('You’ve got ' + youGot);
}
getStuff('mail', true); // ['mail', true]

It will do you good to understand the terms that come with thinking of code in this way. We can start with the client. The client is the object or function that needs the dependency for their code to work. Like when you request a cleaning service, you become one of their clients. A service therefore is the provider to the client, or an object or function that plays the role of performing a task that the client needs. In frameworks such as AngularJS you can interact with an injector, which is an object that is responsible for fetching the services for the client when the client needs them.

There are many benefits to this concept. Let’s go back to the example of the child and the food. As I stated, letting them make their own would lead to a lot of mistakes & mess that somebody is going to have to clean up later. This thought process can be applied to coding. If every time we wanted to do something we just did it all in line, it would probably get messy the more we had to do. We break things down into functions and store them in objects so that when we need to do something. We have things to handle the hard stuff for us, and only use them to fulfill our needs when we need them, which allows us to separate our code and when something goes wrong, we can figure out much faster where. We could potentially separate it into entirely different files if a piece of code knows where to look for its dependencies. If you know what the end output of the provided code is supposed to be, you can use it freely. The onus of it working correctly is not on the current code. Through this a much neater & desirable layout can be achieved.

Dependency injection is a big word, but it explains an old concept that most would be familiar with. I hope this post helped answer some questions you may have had about it.