асинхронные/ОЖИДАНИЕ не работает в ForEach

Question

Получить неожиданный маркер при попытке использовать асинхронный/Await в forEach

export let appState = observable({ 
     bunny : [] 
    }); 

    appState.loadBunny = async function(bugs) { 
    bugs.forEach(function(data) { 
     let temp = {}; 
     temp['id'] = data.id; 
     temp['site_url'] = data.site_url; 
     temp['email'] = await decrypt(sessionStorage.getItem('key'), data.email); 
     temp['username'] = await decrypt(sessionStorage.getItem('key'), data.username); 
     temp['password'] = await decrypt(sessionStorage.getItem('key'), data.password); 
     temp['note'] = await decrypt(sessionStorage.getItem('key'), data.note); 
     temp['tag'] = await decrypt(sessionStorage.getItem('key'), data.tag); 
     temp['created_at'] = data.created_at; 
     temp['updated_at'] = data.updated_at; 
     runInAction("update state after decrypting data",() => { 
      this.bunny.push(temp); 
     }); 

    }); 
}; 

    appState.fetch = async function() { 
     let xoxo = await axios.get('/api/vault/', { 
      headers: {'Authorization': "JWT " + sessionStorage.getItem('token')} 
     }); 
     this.loadBunny(xoxo.data); 
    } 

и вот ошибка:

ERROR in ./static/apps/store/passwords.js 
Module build failed: SyntaxError: ...static/apps/store/passwords.js: Unexpected token (15:30) 
    13 |   temp['id'] = data.id; 
    14 |   temp['site_url'] = data.site_url; 
> 15 |   temp['email'] = await decrypt(sessionStorage.getItem('key'), data.email); 
    |        ^
    16 |   temp['username'] = await decrypt(sessionStorage.getItem('key'), data.username); 

Answer 1

await следует использовать в функции async, и он используется в forEach обратном вызове, который является обычной функцией.

Даже если async функция предоставляется как обратная связь forEach, обещание не может быть получено, потому что forEach ничего не возвращает.

Для этого обещание цепи должно быть сформировано вручную.

appState.loadBunny = async function(bugs) { 
    let promise = Promise.resolve(); 

    bugs.forEach(function(data) { 
     promise = promise.then(async function() { 
     let temp = {}; 
     ... 
     }); 
    }); 

    await promise; 
    } 

Это причина, почему for...of имеет важное значение в async функций:

appState.loadBunny = async function(bugs) { 
    for (const data of bugs) { 
     let temp = {}; 
     ... 
    }); 
    } 

генератор функций и yield ведут себя подобным образом в таких случаях.

Answer 2

await работает только внутри async функции, например:

async function test() { 
    await myObj.setObj(2, 3); 

    console.log(obj.a + obj.b); 
} 

test(); 

Как и следовало ожидать, вы должны сделать рефакторинг ваш код, чтобы звонки await decrypt(sessionStorage.getItem('key'), data.email находились внутри их собственных функций async.