The principle of implementing Di in JavaScript (II.)

The principle of implementing di in JavaScript

Implementing di in JavaScript, which looks difficult, is actually simple, and its core technique is the ToString () of the function object. We all know, to a function object execution ToString (), its return value is the source of the function, know this, then simple: I get the function source code, and then I parse the function declaration, pseudo code as follows:

varGiveme =function(config) {};varRegistry = {};varinject =function(func, Thisforfunc) {//Get Source code    varSource =func.tostring (); //using regular expressions to parse the source code    varMatcher = Source.match (/..) The expression is somewhat complex, omitted. /); //The parse result is the name of each parameter    varObjectIds = ....    //check out the corresponding object and put it in the array to be passed as a parameter .    varobjects = [];  for(vari = 0; i < objectids.length; ++i) Objects.push (Registry[objectids[i]); //Call this function, and pass the arguments overFunc.apply (Thisforfunc | |func, objects)}; Inject (giveme)

Of course, a real di system has a lot more to think about than this, but this code should be enough to show the principle.

Next we look at the DI implementation in angular:

In angular, all major programming elements need to be registered in some way, such as Mymodule.service (' ServiceName ', function () .... This is actually to add the back of this function to a container, note that: angular fully implemented lazy initialization, that is, when the object is not needed by others, it is not created, which is helpful to improve performance, especially to speed up the startup speed.

Here's an interesting question: what is the container for angular. Angular does not have a real global object, so you can rest assured that you put multiple apps on the same page without worrying about them interfering with each other, but the container needs a well-known place to store the "Names and Objects" registry (Registry), in angular, This registry is called module, so now you should know why the status of module is important? However, there can be many different name module in an app, there are some dependencies between them, which is embodied in the Declaration syntax of module: Angular.module (' somemodule ', [' dep1 ', ' dep2]), This partitioning of the module facilitates the file organization of the program.

According to the principle of Di, a natural inference is that the injected object is usually a singleton, because it is created so that it can always be used, and it does not need to be created more than once. So, if you need to share data or communication across controllers in angular, you can create a service/value/constant, and then inject them into two controllers, respectively. And these two controllers will naturally share the same object.

The principle of implementing Di in JavaScript (II.)