Verwenden Sie async await und .then zusammen

Lesezeit: 4 Minuten

Benutzer-Avatar
PixelPaul

Kann die Verwendung schaden? async/await und .then().catch() zusammen wie:

async apiCall(params) {
    var results = await this.anotherCall()
      .then(results => {
        //do any results transformations
        return results;
      })
      .catch(error => {
        //handle any errors here
      });
    return results;
  }

  • Schätze ich anotherCall tut das .then Forderung?

    – Jojo Narte

    6. März 2019 um 9:38 Uhr

  • Entschuldigung, vergessen. habe es jetzt hinzugefügt.

    – PixelPaul

    6. März 2019 um 9:44 Uhr

  • nein, es schadet nichts. Sie übergeben nur den endgültigen Wert der Promise-Kette an die result Variable verwenden await.

    – yqlim

    6. März 2019 um 10:00 Uhr

Benutzer-Avatar
Diashowp2

Ich benutze immer async/await und .catch() statt zu verwenden async/await und try/catch Code kompakt zu machen.

async function asyncTask() {
  throw new Error('network')
}
async function main() {
  const result = await asyncTask().catch(error => console.error(error));
  console.log('result:', result)
}

main();

Wenn Sie einen Fallback-Wert erhalten möchten, wenn ein Fehler aufgetreten ist, können Sie den Fehler ignorieren und einen Wert innerhalb der zurückgeben .catch() Methode

async function asyncTask() {
  throw new Error('network')
}
async function main() {
  const result = await asyncTask().catch(_ => 'fallback value');
  console.log('result:', result)
}

main();

  • Dein Weg war mir nicht in den Sinn gekommen, aber ich mag ihn wirklich! Normalerweise mische ich sie umgekehrt, indem ich eine try / catch-Anweisung mit await habe und .then verwende, um eine zusätzliche Transformation oder was auch immer für das aufgelöste Promise durchzuführen.

    – Quantenfrettchen

    16. November 2020 um 11:30 Uhr

  • Angenommen, Sie haben nach dem mehr Code result = Linie. Nehmen wir an, dass ein Fehler aufgetreten ist. Ist result dann undefiniert?

    – Jeff Padgett

    7. Januar 2021 um 5:16 Uhr

  • @JeffPadgett Ja, Sie können einen Fallback-Wert von zurückgeben .catch() Methode

    – Diashowp2

    4. März 2021 um 1:51 Uhr

  • Haben Sie etwas dagegen, Ihre Antwort mit einem Fallback von der zu aktualisieren .catch() Methode?

    – Jeff Padgett

    4. März 2021 um 18:34 Uhr

  • @JeffPadgett Aktualisierte Antwort.

    – Diashowp2

    5. März 2021 um 1:49 Uhr

Benutzer-Avatar
Schubh

Eine asynchrone Funktion kann einen Erwartungsausdruck enthalten, der die Ausführung der asynchronen Funktion anhält und auf die Auflösung des übergebenen Promise wartet und dann die Ausführung der asynchronen Funktion fortsetzt und den aufgelösten Wert zurückgibt.

Wie Sie im folgenden Beispiel sehen können, können Sie zwei Möglichkeiten verwenden, um das Ergebnis und die Fehler zu behandeln (Ich verstehe nicht ganz, was Sie hier als Schaden bezeichnen).

function returnpromise(val) {
  return new Promise((resolve, reject) => {
    if (val > 5) {
      resolve("resolved"); // fulfilled
    } else {
      reject("rejected"); // rejected
    }
  });
}

//This is how you handle errors in await
async function apicall() {
  try {
    console.log(await returnpromise(5))
  } catch (error) {
    console.log(error)
  }
}

async function apicall2() {
  let data = await returnpromise(2).catch((error) => {
    console.log(error)
  })
}

apicall2();
apicall();

Weitere Informationen finden Sie unterMDN-DOCS

Ich möchte keine Toten auferwecken, aber darauf hinweisen, dass mit await zusammen mit A then Kette bedeutet, dass das Ergebnis von:

const x = await someAsyncFn().then(() => doSomeLogging());

Der Wert von x wird der Rückgabewert von zugewiesen .thenwas für mich nicht sehr intuitiv war.

Benutzer-Avatar
PeterYuan

Ich denke nicht, dass die gemischte Verwendung von async/await + then eine gute Idee ist. Besonders wenn Sie sich auf die Auflösung der asynchronen Funktion konzentrieren, birgt die gemischte Verwendung ein gewisses Risiko, dass Ihre Auflösung stillschweigend verzerrt wird.

Beispiel:

const res = await fetchData().then(()=>{return "something else"}).catch((err)=>{});

console.log(res); // not expected res data but something else

Mischnutzung ist also gefährlich, es schadet übrigens, Codes zu lesen.

Wenn Sie Async/await verwenden, müssen Sie nicht verketten .then() Speichern Sie einfach das von Ihnen zurückgegebene Ergebnis resolve() in einer Variablen (response im Beispiel), aber wenn Sie die Fehler behandeln möchten, müssen Sie Ihren Code versuchen/abfangen:

async function f() {

  try {
    let response = await fetch('http://no-such-url');
  } catch(err) {
    alert(err); // TypeError: failed to fetch
  }
}

in Ihrem Versprechen verwenden:

throw new Error("oops!");

Oder

Promise.reject(new Error("Whoops!"));

  • Ich benutze das die ganze Zeit und es ist besser als die Verwendung von .then + einer anderen anonymen asynchronen Funktion, die das Ganze unlesbar macht

    – Assgeier

    13. September 2020 um 19:55 Uhr

  • Ich benutze das die ganze Zeit und es ist besser als die Verwendung von .then + einer anderen anonymen asynchronen Funktion, die das Ganze unlesbar macht

    – Assgeier

    13. September 2020 um 19:55 Uhr

1011430cookie-checkVerwenden Sie async await und .then zusammen

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy