什么是在另一个内部调用一个异步函数的最佳方法？

Question

I'm making simple authentication on React Native app using AsyncStorage to keep token. And after fetch I need to call AsyncStorage to save the token I've received. I'm looking for an advice: what is the best-practice way to do it?

function login(username, password) {
  const requestOptions = {
    "method": "POST",
    "headers": { "Content-Type": "application/json" },
    "body": JSON.stringify({ username, password })
  };
  return fetch(`${BASE_URL}/authenticate`, requestOptions)
    .then(response => {
      return response.json();
    })
    .then(res => {
      AsyncStorage.setItem("@Storage:key", user.token).then();//doing smth);
      return res;                    
    });
}

Answer 1

You would await with all the async requests

async function login(username, password) {

    const requestOptions = {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ username, password })
    }

    const res = await fetch(`${BASE_URL}/authenticate`, requestOptions)
    const response = await response.json();
    await AsyncStorage.setItem('@Storage:key', user.token)
    return response.msg
}

Answer 2

Generally, chaining Promises is one of the cleanest ways. For example, something like:

return fetch(url)
  .then(res => res.json())
  .then(res => AsyncStorage.setItem('key', token).then(res => res.msg));

Pretty much how you had it.

If you can use Babel to transpile, using async/await can make it even nicer:

const res = await (await fetch(url)).json();
await AsyncStorage.setItem('key', token);

With await and async , as long as your await on a Promise , you can then treat them the same as non-async code.