Partager des idées pour implémenter l'injection de dépendances dans les compétences JavaScript_javascript

De nos jours, chaque framework est modularisé, même le javascript front-end ne fait pas exception. Chaque module est responsable de certaines fonctions, et il existe des interdépendances entre les modules. La question se pose donc : Comment implémenter l'injection de dépendances en JavaScript ? (L'injection de dépendances de JavaScript a des implémentations correspondantes dans tous les principaux frameworks. Ici, nous apprenons uniquement les idées d'implémentation)

Les exigences suivantes :

Supposons qu'il existe déjà un ensemble de valeurs-clés de module de service défini, func est le nouveau service ajouté et la liste de paramètres est la dépendance du service.

Copier le code Le code est le suivant :

var services = { abc : 123, def : 456, ghi : 789 }; // Supposons qu'un service
ait été défini fonction Service(abc, ghi){
This.write = function(){
console.log(abc);
console.log(ghi);
>
>
fonction Activateur(func){
var obj;
// Implémenter
Retourner l'objet ;
>

Solution :

Par un mécanisme (réflexion ?), retirez la liste de paramètres définie par la fonction et attribuez les valeurs une par une. Ensuite, instanciez la fonction via un mécanisme (Activitor ?).

Solution :

1. Obtenez la liste des paramètres de la fonction :

Comment obtenir la liste des paramètres ? La première chose qui me vient à l’esprit est le mécanisme de réflexion. Alors, y a-t-il une réflexion en javascript ? Il devrait y en avoir. Actuellement, je sais seulement comment utiliser la fonction eval(str), mais il semble qu'il n'y ait pas d'implémentation pertinente pour obtenir la liste des paramètres. En regardant à nouveau la définition de func.arguments, cette propriété n'est valide que lorsque func est appelée et que les paramètres sont transmis, et elle ne peut pas répondre aux exigences.

Pouvons-nous obtenir la liste des paramètres en traitant la chaîne après func.toString() ?

Commencez et essayez :

Copier le code Le code est le suivant :

fonction getFuncParams(func) {
var matches = func.toString().match(/^functions*[^(]*(s*([^)]*))/m);
Si (correspond à && matches.length > 1)
            renvoie les correspondances[1].replace(/s*/, '').split(','
); Retourner [];
};

À ce stade, le tableau de liste de paramètres func est obtenu.

2. Rechercher les dépendances en fonction de la liste des paramètres :

Après avoir obtenu la liste des paramètres, c'est-à-dire la liste des dépendances, il est très simple de transmettre les dépendances en tant que paramètres.

Copier le code Le code est le suivant :

var params = getFuncParams(func);
pour (var i dans les paramètres) {
params[i] = services[params[i]];
>

3. Passer les paramètres de dépendance et instancier :

Nous savons qu'il existe deux fonctions appelées func.constructor en javascript : call(thisArg,[arg[,arg,[arg,[…]]]]) et apply(thisArg,args…), qui peuvent toutes deux être instancié opération func. Le premier paramètre de la fonction d'appel est ce pointeur, et le reste est la liste des paramètres. Cela peut être utilisé lorsque la liste des paramètres func est connue, mais ne répond pas à mes besoins. En regardant la deuxième fonction d'application, le premier paramètre est également ce pointeur, et le deuxième paramètre est le tableau de paramètres. Lorsqu'il est appelé, il attribuera automatiquement des valeurs à la liste de paramètres de func une par une, ce qui correspond juste à mon. besoins.

Le code est à peu près le suivant :

Copier le code Le code est le suivant :

fonction Activateur(func){
var obj = {};
func.apply(obj, params);
Retourner l'objet ;
>

À ce stade, nous pouvons créer une instance de la fonction et transmettre les paramètres requis par la fonction.

4. Imprimer et tester :

Code complet :

Copier le code Le code est le suivant :

var
// Supposons qu'un service
ait été défini Services = { abc : 123, déf : 456, ghi : 789 },

// Récupère la liste des paramètres de func (liste de dépendances)
GetFuncParams = fonction (func) {
         var matches = func.toString().match(/^functions*[^(]*(s*([^)]*))/m);
Si (correspond à && matches.length > 1)
                 renvoie les correspondances[1].replace(/s /, '').split(',');
         retourner [];
},

// Remplir les paramètres (dépendances) en fonction de la liste de paramètres (liste de dépendances)
setFuncParams = fonction (params) {
pour (var i dans les paramètres) {
              params[i] = services[params[i]];
>
         renvoie les paramètres ;
};

// Activateur
fonction Activateur(func) {
var obj = {};
func.apply(obj, setFuncParams(getFuncParams(func)));
Retourner l'objet ;
>

//Définir un nouveau service
fonction Service(abc, ghi) {
This.write = function () {
console.log(abc);
console.log(ghi);
>
>

// Instancier le service et la méthode d'appel
var service = Activitor(Service);
service.write();

La console s'imprime avec succès !