Понимание обещаний и ожиданий

Frank спросил: 28 апреля 2018 в 08:53 в: javascript

Я просто пытаюсь понять, как работают Promises и Await .
Я хочу, чтобы это разрешилось, зарегистрировав 1, 2, 3 в этом порядке. В настоящее время он записывает 1, 3, 2.

Я знаю, что Promise здесь не имеет смысла, но в моей программе у него есть другой использует так, чтобы он оставался. Маршрут от Caller до Test также должен оставаться (если нужно, вы можете их изменить, но просто знаете, что они есть по какой-то причине)

My вопрос в том, как я могу ожидать, что функция Caller будет решена?

Вот мой код:

function Test() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('2');
      resolve();
    }, 2000);
  })
}

function Caller() {
  Test();
}

console.log('1');
Caller();
console.log('3');

Я попытался понять, что я понимаю, а это значит, что функция Caller () будет ждать тестового обещания, но это, конечно, делает функцию async для Caller (), и поэтому мы все равно получаем 1, 3, 2

async function Caller() {
    await Test();
}

Можно ли использовать какой-либо способ ожидания без выполнения функции async?


4 ответа

Quentin ответил: 28 апреля 2018 в 08:58
  • Вы можете только await использовать функцию, которая возвращает обещание (ну, не совсем верно, если оно не возвращает обещание, которое создает обещание, которое разрешается мгновенно)
  • Вы можете только await, когда находитесь внутри асинхронной функции
function test() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('2');
      resolve();
    }, 2000);
  })
}

async function caller() {
  console.log('1');
  await test();
  console.log('3 (this is blocked awaiting the promise');
}

caller()
console.log("This is not blocked because caller is async");
vsync ответил: 28 апреля 2018 в 09:58

Это очень простой и простой способ сделать то, что вы просите.

Ключевое слово await может использоваться только внутри функций, определенных с помощью async.

function test(ms) {
  return new Promise((resolve, reject) => setTimeout(resolve, ms))
}

async function caller() {
  console.log(1, ' - caller() started');
   
  await test(2000).then(() => {
      console.log(2, ' - test() resolved')
  });
  
  console.log(3, ' - delayed until "test()" has resolved');
  
  return 4;
}

// wait for "caller()" to resolve
caller().then((result) => {
    console.log(result, " - caller() finished")
});

Вот хорошая статья от Google, которая расширяется по теме:
Асинхронные функции - создание дружественных обещаний.

Источник цитирования.

Richard Fox ответил: 28 апреля 2018 в 08:57

вот как вы могли бы использовать такие функции:

function sleep(ms) {
  return new Promise(r => {
    setTimeout(() => r(), ms);
  });
}

(async () => {
  console.log(1);
  await sleep(1000); // 1s
  console.log(2);
  await sleep(2000) // 2s
  console.log(3)
})();
Frank ответил: 28 апреля 2018 в 09:23

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

function Test() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('2');
      resolve();
    }, 2000);
  })
}

function Caller() {
  return Test();
}

(async() => {
  console.log('1');
  await Caller();
  console.log('3');
})();