非同期フローを理解するのに役立つように、コードにいくつかのコメントを挿入するだけです。
var joined = function(arr) {
// Timestamp: 0
var res = [];
for (var i in arr) {
// Timestamp: 1
var u = DB.getUser(arr[i].user_id, function(user) {
// Timestamp 4 ... length of arr
// user contains what you are looking for
// but this is not return to u, because we passed that a long time ago
return user;
});
// u is null or undefined, because DB.getUser returns nothing
// is a async function, you need wait for the callback
arr[i].user = u;
// Timestamp: 2 return useless arr
res = arr[i];
}
// Timestamp: 3 again, return a useless array
return res;
}
編集:
すべてをテンプレートに渡す前に、これを行う必要があります。
var joined = function(arr, doneCallback) {
var res = []
var count = arr.length;
for (var i in arr) {
DB.getUser(arr[i].user_id, function(user) {
count--;
res.push(user);
if (count == 0) {
doneCallback(res);
}
})
}
}
joined(somedata, function(mydata) {
render(template, mydata)
});
いくつかのフロー制御ライブラリを見てみましょう。(私のお気に入りのasync )