Fonctions asynchrones dans une boucle

Version imprimable

Bonjour à tous,

Je block sur un truc et fais donc appel à nos éminents habitants du forum :

Je voudrais créer de manière asynchrone un array à partir d'un string :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
arrMetamorph = function(str) {
    var newArr = {};
    arr = str.split(" ");
    arr.map(function(el){
        getTransformation(el, function(output){
            if(output){
                if (typeof(newArr[output])=="undefined") {
                    newArr[output]=1;
                }else{
                    newArr[output]+=1
                }
            }
        });
    });
    console.log(JSON.stringify(newArr));
}
 getTransformation = function(input,cb){
        setTimeout(function () {
            cb('"'+input+"'");
        }, 2000);
}
 
arrMetamorph('1 2 3 4 5')

Normalement getTransformation tape dans une bdd

Le résultat est {}. Quelqu'un pourrait-il me donner une astuce pour lancer

Code:

1
2
 
console.log(JSON.stringify(newArr));

un fois la boucle terminée ?

Il y a du mieux avec une promise mais je sèche toujours sur mon console.log final. Il quelque chose qui se rapproche à un then() appliqué à map non ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
 
arrMetamorph = function(str) {
    var newArr = {};
    arr = str.split(" ");
    arr.map(function(el){
        getTransformation(el).then(function(output){
        	console.log('sortie');
            if(output){
                if (typeof(newArr[output])=="undefined") {
                    newArr[output]=1;
                }else{
                    newArr[output]+=1
                }
            }
            console.log(JSON.stringify(newArr))
        });
    });
}
 function getTransformation(input){
 	return new Promise(function(resolve, reject){
  	console.log('entree');
    setTimeout(function () {
		  resolve('"'+input+'"');
    }, 2000);
  });
}
 
arrMetamorph('a a a z z');

PS : le code est testable sur jsfiddle

J'ai avancé sur le contrôle du console.log final mais maintenant mon output renvoi l'objet promise en entier... Pour il devrait renvoyer dans le next l'argument qui est dans resolve ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
arrMetamorph = function(str) {
    var newArr = {};
    arr = str.split(" ");
    arr.reduce(function(el){
        return getTransformation(el).then(function(output){
            console.log('sortie');
            if(output){
                if (typeof(newArr[output])=="undefined") {
                    newArr[output]=1;
                }else{
                    newArr[output]+=1
                }
            }
        })
    },Promise.resolve()).then(function(){
            console.log(JSON.stringify(newArr));
    });
}
 function getTransformation(input){
    return new Promise(function(resolve, reject){
    console.log('entree');
    setTimeout(function () {
          resolve('"'+input+'"');
    }, 2000);
  });
}
 
arrMetamorph('a a a z z');

Cette fois c'est la bonne pour ceux que ça intéresserait :

Explication :
https://developer.mozilla.org/fr/doc...x/Array/reduce

Le premier arg du callback de reduce est la valeur précédente !

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
 
 
arrMetamorph = function(str) {
    var newArr = {};
    arr = str.split(" ");
    arr.reduce(function(prev,current){
        return getTransformation(current).then(function(output){
        	console.log('sortie');
            if(output){
                if (typeof(newArr[output])=="undefined") {
                    newArr[output]=1;
                }else{
                    newArr[output]+=1
                }
            }
        })
    },Promise.resolve()).then(function(){
			console.log(JSON.stringify(newArr));
    });
}
 function getTransformation(input){
 	return new Promise(function(resolve, reject){
  	console.log('entree');
    setTimeout(function () {
		  resolve('"'+input+'"');
    }, 2000);
  });
}
 
arrMetamorph('a a a z z');