Austausch von Ideen zur Implementierung der Abhängigkeitsinjektion in JavaScript_Javascript-Kenntnissen-js-Tutorial-php.cn

Austausch von Ideen zur Implementierung der Abhängigkeitsinjektion in JavaScript_Javascript-Kenntnissen

WBOY

Freigeben： 2016-05-16 16:19:58

Original

810 Leute haben es durchsucht

Heutzutage wird jedes Framework modularisiert, selbst Front-End-Javascript ist keine Ausnahme. Jedes Modul ist für bestimmte Funktionen verantwortlich und es bestehen gegenseitige Abhängigkeiten zwischen den Modulen. Es stellt sich also die Frage: Wie implementiert man die Abhängigkeitsinjektion in JavaScript? (Die Abhängigkeitsinjektion von JavaScript hat entsprechende Implementierungen in allen wichtigen Frameworks. Hier lernen wir nur die Implementierungsideen)

Die folgenden Anforderungen:

Angenommen, es gibt bereits einen definierten Servicemodul-Schlüsselwertsatz, func ist der neu hinzugefügte Service und die Parameterliste ist die Serviceabhängigkeit.

Code kopieren Der Code lautet wie folgt:

var services = { abc : 123, def : 456, ghi : 789 } // Angenommen, dass ein Service
 definiert wurde
Funktion Service(abc, ghi){

This.write = function(){

console.log(abc);

console.log(ghi);

}

}

Funktion Activitor(func){

var obj;

// Implementieren

Rückgabe obj;

}

Lösung:

Nehmen Sie durch einen Mechanismus (Reflexion?) die durch die Funktion definierte Parameterliste heraus und weisen Sie nacheinander Werte zu. Dann instanziieren Sie die Funktion durch einen Mechanismus (Aktivator?).

Lösung:

1. Rufen Sie die Parameterliste der Funktion ab:

Wie erhalte ich die Parameterliste? Das erste, was mir in den Sinn kommt, ist der Reflexionsmechanismus. Gibt es also eine Reflexion in Javascript? Derzeit weiß ich nur, wie man die Funktion eval(str) verwendet, aber es scheint, dass es keine relevante Implementierung zum Abrufen der Parameterliste gibt. Wenn Sie sich die Definition von func.arguments noch einmal ansehen, ist diese Eigenschaft nur gültig, wenn func aufgerufen und Parameter übergeben werden, und kann die Anforderungen nicht erfüllen.

Können wir die Parameterliste erhalten, indem wir den String nach func.toString() verarbeiten?

Legen Sie los und probieren Sie es aus:

Code kopieren Der Code lautet wie folgt:

Funktion getFuncParams(func) {

var matches = func.toString().match(/^functions*[^(]*(s*([^)]*))/m);

If (matches && matches.length > 1)

            return matches[1].replace(/s*/, '').split(',' 

Geben Sie [];
 zurück
};

Zu diesem Zeitpunkt wird das Funktionsparameterlistenarray erhalten.

2. Abhängigkeiten anhand der Parameterliste finden:

Nachdem die Parameterliste, also die Abhängigkeitsliste, abgerufen wurde, ist es sehr einfach, die Abhängigkeiten als Parameter zu übergeben.

Code kopieren Der Code lautet wie folgt:

var params = getFuncParams(func);

for (var i in params) {

params[i] = Dienste[params[i]];

}

3. Abhängigkeitsparameter übergeben und instanziieren:

Wir wissen, dass es in Javascript zwei Funktionen namens func.constructor gibt: call(thisArg,[arg[,arg,[arg,[…]]]]) und apply(thisArg,args…), die beide können Funktionsoperation instanziiert werden. Der erste Parameter der Aufruffunktion ist dieser Zeiger, der Rest ist die Parameterliste. Dies eignet sich zur Verwendung, wenn die Funktionsparameterliste bekannt ist, aber nicht meinen Anforderungen entspricht. Wenn Sie sich die zweite Apply-Funktion ansehen, ist der erste Parameter ebenfalls dieser Zeiger und der zweite Parameter das Parameter-Array. Wenn er aufgerufen wird, weist er der Parameterliste von func automatisch nacheinander Werte zu, die genau meinen Anforderungen entsprechen Bedürfnisse.

Der Code lautet ungefähr wie folgt:

Code kopieren Der Code lautet wie folgt:

function Activitor(func){

var obj = {};

func.apply(obj, params);

Rückgabe obj;

}

An diesem Punkt können wir eine Instanz der Funktion erstellen und die für die Funktion erforderlichen Parameter übergeben.

4. Drucken und testen:

Vollständiger Code:

Code kopieren Der Code lautet wie folgt:

var
// Gehe davon aus, dass ein Service
definiert wurde Dienste = { abc: 123, def: 456, ghi: 789 },

// Parameterliste von func (Abhängigkeitsliste) abrufen
GetFuncParams = Funktion (func) {
         var matches = func.toString().match(/^functions*[^(]*(s*([^)]*))/m);
If (matches && matches.length > 1)
                 return matches[1].replace(/s /, '').split(',');
         return [];
},

// Füllen Sie Parameter (Abhängigkeiten) basierend auf der Parameterliste (Abhängigkeitsliste) aus
setFuncParams = Funktion (params) {
for (var i in params) {
params[i] = services[params[i]];
}
Parameter zurückgeben;
};

// Aktivator
function Activitor(func) {
var obj = {};
func.apply(obj, setFuncParams(getFuncParams(func)));
Rückgabe obj;
}

//Neuen Dienst definieren
Funktion Service(abc, ghi) {
This.write = function () {
console.log(abc);
console.log(ghi);
}
}

// Dienst instanziieren und Methode aufrufen
var service = Activitor(Service);
service.write();

Die Konsole wird erfolgreich gedruckt!