Асинхронный JS -- порядок выполнения async, await, promise, setTimeout

JavaScript

вопрос:

Когда выполняется асинхронный код JavaScript:

  1. Если вы испытываете ожидание, будет ожидать выполнения кода в конце очереди ожидания (поскольку использование природы или обещания асинхронности и ожидания возврата объекта является обещанием).

    Примечание: асинхронность — это синтаксический сахар генератора, просто замените * после функции генератора на предыдущую асинхронность и замените yield на ожидание. Принцип работы тот же, все для решения проблемы асинхронной работы JS, ведь JS однопоточный.

  2. Если встречаются then и catch промиса, они также помещаются в очередь ожидания.Они имеют одинаковый приоритет.После завершения кода синхронизации они выполняются в соответствии с принципом очереди. .

  3. Если встречается setTimeout, он также помещается в очередь ожидания, но это другая очередь ожидания с более низким приоритетом, чем await и promise.

Доказательство кода:

async function async1() {
    console.log("async1 start");
    await  async2();  // 关键点1
    console.log("async1 end");
}
async  function async2() {
    console.log( 'async2');
}
console.log("script start");
setTimeout(function () {
    // 关键点2
    console.log("settimeout");
},0);
async1();
new Promise(function (resolve) {
    console.log("promise1");
    // 关键点3
    resolve();
}).then(function () {
    console.log("promise2");
});
console.log('script end');

Результат выполнения приведенного выше фрагмента кода:

> "script start"
> "async1 start"
> "async2"
> "promise1"
> "script end"
> "async1 end"
> "promise2"
> "settimeout"

объяснять:

------------------------------------------------ Сердце кода синхронизации ------- ------------------------------------------

  1. Код запускается из синхронной операцииconsole.log("script start");В начале, когда встречается setTimeout, он сразу бросается в конец очереди ожидания (фактически это голова другой очереди ожидания с более низким приоритетом, которая считается концом очереди ожидания промиса) .
  2. Выполните функцию async1, гдеconsole.log("async1 start");Для синхронного кода выводите напрямую, а затем встречайтеawait async2.
  3. Войдите внутрь функции async2 и выполните содержащийся в ней синхронный код.console.log( 'async2');После выполнения немедленно поместите весь код, стоящий за AWAIT, в очередь ожидания Promise.
  4. Потом ищем код синхронизации и находим в промисе промисconsole.log("promise1");Для синхронного кода выполнять немедленно. Затем вы обнаружите, что за этим обещанием следует функция then(), не стесняйтесь поместить это обещание прямо в очередь ожидания, которая только что сохранила await.
  5. последний код синхронизацииconsole.log('script end');найден и казнен.

----------------------------------------- Раздел асинхронного кода ------ --------------------------------------

Текущий асинхронный код ожидает в очереди, включая весь код функции ожидания и функцию then() обещания.

  1. Сначала выполните код ожидания async2console.log("async1 end");.
  2. Код разрешения в then() при выполнении обещанияconsole.log("promise2");.
  3. Наконец выполните код setTimeoutconsole.log("settimeout");.

√ На данный момент все коды выполнены.

Категории