JavaScript не дает обещаний

Question

У меня есть две функции.function1() занимает больше времени, чем function2(), потому что выполняет запрос на выборку.Мне нужно, чтобы они запускались в таком порядке, но результаты function2() являются первыми, которые отображаются в HTML DOM.Итак, я попытался решить эту проблему с помощью обещаний .Я сделал первую функцию переменной и создал следующий код:

let promise1 = function1() {
  fetch()
   .then(do x)
   .then(display x to HTML DOM)
  return 0;
};

function2(a) {
  // use the a;
  // display some things to the HTML DOM based on `a`
}

promise1.then((a) => {
      function2(a);
    });

Изначально эти две функции не должны взаимодействовать друг с другом, но для того, чтобы эта работа работала с обещаниями, я создалискусственная потребность с помощью этого оператора return.Тем не менее, это не работает: я получаю ошибку TypeError: promise1.then is not a function.Я пролистал веб-страницу « Подробнее ... », но эти сценарии здесь не применимы.

Я новичок в JS и неофит в обещаниях.Я что-то упустил?

Answer 1

Вам просто нужно вернуть обещание, возвращенное с fetch в вашем первом блоке кода:

let promise1 = function1() {
  return fetch()
   .then(do x)
   .then(() => {
        //returns also need to be async
        return 0;
    });

  //don't do this
  // return 0;
  // return inside the then() above
};

function2(a) {
  // use the a;
  // display some things to the HTML DOM based on `a`
}

promise1.then((a) => {
      function2(a);
    });

Чтобы объяснить это более подробно;Ваш fetch работает асинхронно.Поэтому любые последующие функции не будут ждать (блокироваться).fetch возвращает Promise, который позволяет вам связывать последующие функции по завершении асинхронной функции.Таким образом, чтобы запустить что-либо после fetch, вам нужно использовать Promise, который возвращает fetch.then - это функция объекта Promise, а не выборка, чтобы потреблять обещание (вызов then для объекта обещания), вам нужно сначала вернуть его, следовательно, return fetch().... Как вернуть ответ от асинхронного вызова? подробно расскажет об этом

Answer 2

Чтобы решить эту проблему, вам нужно убедиться, что function1 возвращает объект обещания.

Возвращая объект обещания, это позволяет вам "связать" последующие .then() обработчики от вызовов этой функции(т. е. promise1), как вы пытаетесь это сделать.

Так что в случае вашей конкретной проблемы вы захотите сделать что-то вроде этого:

let promise1 = function1() {
    return fetch('/some/url').then(function (response){
        // Do response processing logic here
        return response; 
    }).then(function (data)  {
       //Chain any other data/response processing
       return data;
    });
};

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

Надеюсь, это поможет!