Javascript - обработка асинхронного состояния гонки - PullRequest
Новая
       4

Javascript - обработка асинхронного состояния гонки

0 голосов
/ 31 марта 2020

NB ПЕРЕД УДАЛЕНИЕМ В ДУБЛИКАТЕ: Я понимаю, что подобные вопросы задавались много раз раньше, однако я потратил несколько часов, пытаясь реализовать это, используя ответы других людей, в последнее время ответ от этого thread Правильный способ ожидания завершения одной функции до завершения sh, прежде чем продолжить? и не увенчались успехом.

У меня есть сервер nodeJS, который успешно возвращает данные, когда мой функция f1 запрашивает его, а другая функция f2, которая вызывает f1, а затем должна что-то делать с выводом этой асин c функции. Я пытаюсь сделать это с помощью синтаксиса async / await и дополнительного обещания в f2, как показано ниже. 

async function f1(){
   try{
       let response = await fetch('MY SERVER URL');
       let data = await response.json();
       return await data;
   }
   catch(e) {
       alert(e);
   }
};


function f2() {
    var promise = f1();
    promise.then(function(result) {
        JSONdata = promise.markers;
        console.log("JSON read into f2");
    })    

    console.log(JSONdata);

, а затем f2 продолжает делать другие вещи ...

Однако проблема в том, что я испытываю состояние гонки с результатом того, что f1 не возвращается вовремя, чтобы иметь возможность что-либо с ним сделать, и поэтому переменные не определены.

Любая помощь в том, как смягчить это, будет оценил, спасибо.

Ответы [ 3 ]

1 голос
/ 31 марта 2020

Примерно так должно работать: 

async function f1() {
   try {
       const response = await fetch('MY SERVER URL')
       return await response.json()
   } catch(e) {
       console.error(e)
   }
}

async function f2() {
    const { markers } = await f1()
    console.log(`Result supplied to 'f2': ${markers}`)
}

В вашем коде await в return await data является избыточным, поскольку data не является обещанием; Кроме того, f2 выглядит неполным.

Обратите внимание, что, хотя, как правило, return await... не требуется в async функциях (и считается плохой формой, даже если это безвредно), если вы хотите попробовать окружение ... поймать, чтобы поймать отказ от обещания, тогда return await... необходимо. Смотрите здесь .

1 голос
/ 31 марта 2020

Придерживайтесь этого шаблона. 

async func1() { 
  console.log('this is async function')
  return JSON.parse(await fetch(options))
}

func2 () { 
   console.log('this is not async function')
 }

        if(await func1()){
            func2()
        }

А у вас слишком много функций в функции 1. Ожидайте только возврата обещания. И не стоит путать себя на этом уровне со смешением синтаксиса «.then» и «await». Попробуйте придерживаться одного шаблона, а затем изучить другой. Тогда смешайте это.

0 голосов
/ 31 марта 2020

Вы должны либо переместить logi c, который использует результат f1 внутри обратного вызова then. 

function f2() {
    var promise = f1();
    promise.then(function(result) {
        var JSONdata = result.markers;
        console.log("JSON read into f2");

        console.log(JSONdata);
    });
}

, либо изменить f2 на async function чтобы вы могли await возвращаемое значение. 

async function f2() {
    var result = await f1();
    var JSONdata = result.markers;
    console.log("JSON read into f2");

    console.log(JSONdata);
}

Если вы еще этого не сделали, ознакомьтесь с руководством MDN Using Promises , которое объясняет их довольно тщательно. Когда вы поймете, как работают обещания, async / await также станет намного проще для понимания.

...