Loose coupling vs tight coupling of services

Question

I understand that we at almost all times want to aim for loose coupling between components within an application & why.

But in the below example if someone could clarify as to why it isn't tightly coupled when we pass in a service as a parameter to a constructor so I could understand the logic that's going on under the hood.

export class Test(){

dataResults;

constructor(service: testService){

this.dataResults = service.getData()

}

}

It's unclear to me what you're really asking about here. "Under the hood" is Angular's dependency injection system, which is a specific implementation not a broad architectural principle. You could argue that Test is still dependent on the TestService, but dependency inversion and constructor injection here means that you can swap out the service (e.g. for testing) which reduces the coupling, because Test doesn't create its own concrete TestService. You should probably read https://angular.io/guide/dependency-injection-pattern. — jonrsharpe, Jun 09 '18 at 09:15

Pranay Rana · Accepted Answer · 2018-06-11T06:00:17.883

Tight coupling means : Code written is dependent on one class only, for example if i write

service:TestService;
constructor(){
this.service = new TestService();
this.dataResults = service.getData()
}

above code is tightly coupled because if tomorrow if i want to replace TestService with ActualService, I have to open files which is consuming TestService and have to do modification.

Now, Loose Coupling is reverse of tight coupling , means class is not dependent directly on the class whose service it consuming. In higher order language like C# , for loose coupling code is written like this

public class A{
  A(IB service) {//here IB is interface , on which A class is depedant
   //use service here 
  }
}

public class B : IB { }
public class C : IB { }

so now A id dedpend on IB , you can easily do this

A a = new A(new B());
or 
A a = new A(new C());

so its create that A is depend on IB which can be B or C. so it becomes loosely coupled with B and C.

Now coming to your code which Angular code,

In angular when we make use of any service in out component , we do register it via provider either at module or at component.

[{ provide: Logger , useClass: Logger}]

and then in component it used like

constructor(service: Logger){
  this.dataResults = service.getData()
}

Now tomorrow if i want to replace Logger with BetterLooger I just need to do like this

[{ provide: Logger , useClass: BetterLogger}]
or 
[{ provide: Logger , useClass: TestLogger}]

with out going in component code , thats how it becomes loose coupled. Or even its very helpful in testing of components also, where one want to replace actul service with MockService (check here : https://angular.io/guide/testing)

for above to work BetterLogger and TestLogger must extend Logger. you can go there and check in detail : https://angular.io/guide/dependency-injection

Further read : Dependency Injection and SOLID

Loose coupling vs tight coupling of services

1 Answers1

Linked