Стоит ли использовать asyn c await для этого примера - PullRequest
0 голосов
/ 18 июня 2020

Кажется, что следующий пример работает как с asyn c await вот так:

import { db } from '../firebase';

const onAdd = async () => {
    await db.collection('FlashCards').add({
      originalText: newOriginalText,
      translatedText: newTranslatedText,
    });

  };

И без asyn c await вот так:

import { db } from '../firebase';

const onAdd = () => {
    db.collection('FlashCards').add({
      originalText: newOriginalText,
      translatedText: newTranslatedText,
    });

  };

Есть ли разница, какой я использую? Улучшает ли использование asyn c await что-нибудь в этом примере?

Ответы [ 3 ]

1 голос
/ 18 июня 2020

Это зависит от того, какое поведение вы ожидаете.
Как упоминалось в документации Firebase, метод .add(...) является asyn c. https://firebase.google.com/docs/firestore/manage-data/add-data#add_a_document

Функции Await / Asyn c гарантируют, что выполнение хранилища завершено.
Если вам не нужно гарантировать, что данные сохраняются в вашей БД после функции onAdd звоните, можно обойтись без asyn c.

1 голос
/ 18 июня 2020

Async / Await гарантирует, что ваш процесс будет выполняться синхронно. поэтому до завершения выполнения onAdd () остальная часть кода не будет обработана. хотя это зависит от вашего контекста, нужно это или нет.

, но в соответствии с вашим контекстом, я думаю, что Async / Await будет лучше.

1 голос
/ 18 июня 2020

Я бы посоветовал использовать первый фрагмент. У этого есть преимущество - вы можете дождаться, пока onAdd закончит sh, если вы используете sh. Во втором примере вы можете выполнить его, и код будет работать - вставка будет выполнена, однако вы не можете дождаться завершения.

Вот простой пример:

//simple delayed operation - prints a message after 2 seconds
async function delayedOperation(msg) {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log("complete:", msg);
      
      resolve();
    }, 2000);
  });
}

//awaiting the operation
async function withAwait() {
  await delayedOperation("with await");
}

//not awaiting the operation
function withoutAwait() {
  delayedOperation("without await");
}

async function main() {
  console.log("before calling withAwait()");
  await withAwait();
  console.log("after calling withAwait()");
  
  console.log("before calling withoutAwait()");
  await withoutAwait();
  console.log("after calling withoutAwait()");
}

main();

Как видите, самого withoutAwait нельзя ожидать. Проблема в том, что он не создает обещание, main() завершается до завершения отложенной операции в withoutAwait().

Вы всегда можете иметь await в функции, но не использовать, если он не нужен:

async function delayedOperation(msg) {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log("complete:", msg);
      
      resolve();
    }, 2000);
  });
}

async function withAwait() {
  await delayedOperation("with await");
}

async function main() {
  console.log("before calling withAwait()");
  //not awaiting because we don't care whether it finishes before proceeding
  withAwait(); 
  console.log("after calling withAwait()");
}

main();

Однако рекомендуется проверить, завершена ли операция, иначе вы не сможете реагировать на ошибки или даже можете не знать, что они произошли:

//WILL FAIL!
async function delayedOperation(msg) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {      
      reject(`problem when doing [${msg}]`);
    }, 2000);
  });
}

async function withAwait() {
  await delayedOperation("with await");
}

async function main() {
  console.log("before calling withAwait() and handling the error");
  try {
    await withAwait(); 
  } catch(e) {
    console.error(e);
  }
  console.log("after calling withAwait() and handling the error");
  
  console.log("before calling withAwait() - no handling");
  //not awaiting because we don't care whether it finishes before proceeding
  withAwait(); 
  console.log("after calling withAwait() - no handling");
}

main();

И примечание, добавление async, но не await не позволит вам правильно await результат функции.

async function delayedOperation(msg) {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log("complete:", msg);
      
      resolve();
    }, 2000);
  });
}


// async function but not awaiting the operation
async function withoutAwait() {
  delayedOperation("without await");
}

async function main() {
  console.log("before calling withoutAwait()");
  //attempting to await the completion
  await withoutAwait();
  console.log("after calling withoutAwait()");
}

main();

Поскольку тело withoutAwait() не имеет await, оно завершается, как только delayedOperation() возвращает обещание, а не когда это обещание выполняется. .

...