The idea of realizing dependency injection in JavaScript sharing _javascript skills

Today, the frameworks are modular, and even the front-end JavaScript is no exception. Each module is responsible for a certain function, modules and modules are interdependent, then the question is: JavaScript how to implement dependency injection? (JavaScript Dependency Injection, each major framework has a corresponding implementation, here only to learn to implement ideas)

The following requirements:

Suppose you already have a defined service Module Key-value collection, Func for the new service you added, and the parameter list is a service dependency.

Copy Code code as follows:

var services = {abc:123, def:456, ghi:789}; Let's say some service is defined.
function Service (ABC, GHI) {
This.write = function () {
Console.log (ABC);
Console.log (GHI);
}
}
function Activitor (func) {
var obj;
Realize
return obj;
}

Solution idea:

Through some sort of mechanism (reflection?) , remove the list of parameters defined by the Func and assign the values. And then through some kind of mechanism (activitor?) ), instantiate the Func.

Solution:

First, get the func parameter list:

How do I get a list of parameters? The first thing I thought of was the reflex mechanism. Is there any reflection in the JavaScript? It should be, I'm just using the eval (str) function, but I don't seem to get the relevant implementation of the argument list. Looking at the func.arguments definition, this property is only valid when calling Func and passing parameters, and does not satisfy the requirement.

Can you get a list of arguments by handling the string after func.tostring ()?

Try it out:

Copy Code code as follows:

function Getfuncparams (func) {
var matches = func.tostring (). Match (/^function\s*[^\ (]*\ \s* ([^\)]*) \)/m);
if (matches && matches.length > 1)
Return Matches[1].replace (/\s*/, '). Split (', ');
return [];
};

This gets an array of func argument lists.

Second, based on the list of parameters to find dependencies:

You get the list of arguments, you get a list of dependencies, and it's easy to pass dependencies as arguments.

Copy Code code as follows:

var params = Getfuncparams (func);
for (var i in params) {
Params[i] = services[params[i]];
}

third, pass the dependency parameter and instantiate it:

We know that there are func.constructor in JavaScript with call (thisarg,[arg[,arg,[arg,[...)]] and apply (Thisarg,args ...) Two functions, you can implement an instantiated func operation. Where the call function's first argument is the this pointer, and the rest is the argument list, which is suitable for use in the case of a known func parameter list, and does not meet my needs. Look at the second apply function, the first argument is the this pointer, and the second argument is an array of arguments, which is automatically assigned to Func's argument list one by one when invoked, just to meet my needs.

The code is probably as follows:

Copy Code code as follows:

function Activitor (func) {
var obj = {};
Func.apply (obj, params);
return obj;
}

At this point we were able to create an instance of the Func and pass the parameters that the Func needed.

Four, print test it:

Complete code:

Copy Code code as follows:

Var
Let's say some service is defined.
Services = {abc:123, def:456, ghi:789},

Gets the argument list for Func (dependent list)
Getfuncparams = function (func) {
var matches = func.tostring (). Match (/^function\s*[^\ (]*\ \s* ([^\)]*) \)/m);
if (matches && matches.length > 1)
Return Matches[1].replace (/\s+/, '). Split (', ');
return [];
},

Fill parameters (dependencies) based on the argument list (dependent list)
Setfuncparams = function (params) {
for (var i in params) {
Params[i] = services[params[i]];
}
return params;
};

Activating device
function Activitor (func) {
var obj = {};
Func.apply (obj, Setfuncparams (Getfuncparams (func)));
return obj;
}

Define new service
function Service (ABC, GHI) {
This.write = function () {
Console.log (ABC);
Console.log (GHI);
}
}

Instantiate the service and invoke the method
var service = activitor (service);
Service.write ();

Console print successfully!