Javascript асинхронно и жду

Question

Я не мог понять, как работают асинхронные и ожидающие.

async function getUsername() {
    await setTimeout(function() {
        console.log("username")
    }, 100)
}

getUsername();
console.log("password")

Я получаю вывод, как показано ниже.

password
username

Но мне нужно запустить эту программу синхронно, используя async ижду.

Пожалуйста, помогите всем.Заранее спасибо.

Answer 1

Прежде всего, вы не можете просто ждать setTimeout, поскольку он не возвращает обещание, вы можете попытаться превратить содержимое этой функции в одну, если хотите дождаться ее выполнения

function getUsername() {
    return new Promise(resolve =>{
        setTimeout(function() {
            console.log("username");
            resolve();
        }, 100)
    })
}

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

getUsername().then(()=>console.log("password"));

Answer 2

Объявление асинхронной функции определяет асинхронную функцию, которая возвращает объект AsyncFunction.

Асинхронная функция - это функция, которая работает асинхронно через цикл обработки событий,

с использованием неявного Promise для возврата своего результата.Но синтаксис и структура вашего

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

function resolveAfter2Seconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  var result = await resolveAfter2Seconds();
  console.log(result);
  // expected output: 'resolved'
}

asyncCall();

async function name([param[, param[, ... param]]]) {
   statements
}

Ссылка 1 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

Ссылка2 : https://medium.com/siliconwat/how-javascript-async-await-works-3cab4b7d21da

Answer 3

Вы можете думать о await как о "распутывании" a Promise.На данный момент ваш код не использует Promise и, следовательно, await не будет работать.Вместо этого вы можете заключить ваше setTimeout в обещание и resolve ваше обещание, когда оно будет выполнено.Затем, используя await, вы можете получить разрешенное значение из Promise (только после того, как оно будет разрешено (после 100 м / с)) и зарегистрировать его на консоли.

async функции будуттакже всегда возвращайте Promise.Таким образом, вы можете использовать метод .then при вызове функции для запуска «обратного вызова» после завершения функции getUsername:

async function getUsername() {
    var username = await new Promise(resolve => setTimeout(function() {
        resolve("username");
    }, 100));
    
    console.log(username);
}

getUsername().then(res => {
  console.log("password")
}).catch(er => {
  console.error(er);
});

Хотя приведенный выше код работает, я предпочитаю регистрировать свое содержимое в результирующем обратном вызове .then:

const getUsername = async _ => await new Promise(resolve => setTimeout(_ => resolve("username"), 100));

getUsername().then(result => {
  console.log(result);
  console.log("password");
}).catch(er => {
  console.error(er);
});

Или, если вы предпочитаете не использовать обратный вызов .then и использовать вместо него функцию async, вы можете использовать:

const getUsername = async _ => await new Promise(resolve => setTimeout(_ => resolve("username"), 100));

const getUsernameAndPassword = async _ => {
  const username = await getUsername();
  console.log(username);
  console.log("password");
}

getUsernameAndPassword();