【javascript】each時のindexの値がおかしい

Question

前提・実現したいこと

DBから取得したデータを順番通りに出力したい。

該当のソースコード

$.each(users,function(index,val){
    (async()=>{
        console.log(index); //一つ目
        dataExperience = database.ref('/experience/' + val.experience_id);
        var p = await new Promise(resolve=>{
            setTimeout(()=>{resolve(dataExperience.once("value"))},0);
        })
        .then(function(snapshot) {
            console.log(index); //二つ目
        });
    });
});

発生している問題

今回はデータベースから取得したデータを元に、別テーブルも参照してデータを取得したい。
データ自体は出力できるのだが、indexの値が非同期内の場合、逆になってしまう。
いくら非同期だといえ、逆になる原因が不明。

一つ目のコンソールログ

0
1
2
3
4
5

二つ目のコンソールログ

5
4
3
2
1
0

Answer 1

戻るタイミングが違えば非同期処理は終わったものから表示されます

var users=["aaa","bbb","ccc","ddd","eee"];
$.each(users,function(index,val){
  console.log("out:"+index);
  setTimeout(()=>{console.log("in:"+index)},1000-index*100);
});

outの部分はsetTimeoutが無いのと同じですから0→4
inの部分はコールバック内のスコープで掴んだindexを返すので処理できる順に表示されます