Shulou(Shulou.com)05/31 Report--

In this article, the editor introduces "the principle analysis of dependency injection in JavaScript" in detail, the content is detailed, the steps are clear, and the details are handled properly. I hope this "principle analysis of dependency injection in JavaScript" article can help you solve your doubts.

The following requirements are required:

Suppose you already have a defined service module Key-Value collection, func is the new service added, and the parameter list is the service dependency.

Var services = {abc: 123, def: 456, ghi: 789}; / / assume that some Service function Service (abc, ghi) {this.write = function () {console.log (abc); console.log (ghi);}} function Activitor (func) {var obj; / / implement return obj;}

The solution is as follows:

Through some kind of mechanism (reflection? Take out the list of parameters defined by the func and assign values one by one And then through some mechanism (Activitor? To instantiate the func

Solution:

1. Get the parameter list of func:

How do I get the parameter list? The first thing that comes to mind is the reflection mechanism. Is there any reflection in the javascript? I think so. I only know how to use the eval (str) function so far, but I don't seem to have the relevant implementation of getting the parameter list. Looking at the func.arguments definition, this property is valid only when calling func and passing parameters, and does not meet the requirements.

Can you get the parameter list by processing the string after func.toString ()?

Give it a try:

Function getFuncParams (func) {var matches = func.toString (). Match (/ ^ function\ s * [^\ (] * (\ s * ([^\)] *) / m); if (matches & & matches.length > 1) return matches [1]. Replace (/\ s strike,'). Split (','); return [];}

At this point, you get an array of func parameter lists.

Second, look for dependencies according to the parameter list:

With a list of parameters, that is, a list of dependencies, it's easy to pass in dependencies as parameters.

Var params = getFuncParams (func); or (var i in params) {params [I] = services [params [I]]

Pass dependency parameters and instantiate:

We know that there are func.constructor and call in javascript (thisArg, [arg [, arg, [arg, […]) And apply (thisArg,args …) Both functions can instantiate the func operation. The * parameters of the call function are this pointers and the rest are parameter lists. This is suitable for use when the func parameter list is known, but does not meet my needs. Let's take a look at the second apply function. The * parameters are also this pointers, and the second parameter is a parameter array. When called, it automatically assigns values to the parameter list of func, which meets my needs.

The code is roughly as follows:

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

At this point, we can create an instance of the func and pass the parameters required by the func.

Fourth, print and test it:

Complete code:

Var / / assume that some Service services = {abc: 123,456, ghi: 789}, / / get the parameter list (dependency list) of func getFuncParams = function (func) {var matches = func.toString (). Match (/ ^ function\ s * [^\] * (\ s * ([^\)] *) / m) If (matches & & matches.length > 1) return matches [1] .replace (/\ split split (','); return [];}, / / fill the parameter (dependency) according to the parameter list (dependency list) setFuncParams = function (params) {for (var i in params) {params [I] = services [params [I]] } return params;}; / / Activator function Activitor (func) {var obj = {}; func.apply (obj, setFuncParams (getFuncParams (func); return obj;} / / define a new Service function Service (abc, ghi) {this.write = function () {console.log (abc); console.log (ghi) }} / / instantiate Service and call the method var service = Activitor (Service); service.write (); read here, this article "Analysis of the principle of dependency injection in JavaScript" has been introduced. If you want to master the knowledge points of this article, you still need to practice and use it yourself to understand it. If you want to know more about related articles, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.