javascript - Bagaimana membuat return menunggu timeout di dalam fungsi di typescript


Saya sedang mencoba membuat metode yang mengembalikan sebuah promise, tetapi saya perlu menunggu dalam timeout untuk mengembalikan data dari promise itu. Masalahnya adalah metode tersebut mengembalikan promise sebelum timeout selesai, jadi datanya salah. Apakah Anda tahu cara membuat pengembalian menunggu hingga timeout selesai? Terima kasih :)

`

export default async function scrapper(city: string): Promise<Coords> {
    let latitude = "";
    let longitude = "";
    let driver = openDriver();
    setTimeout(async () => {
        await driver.findLatitude(city).then((value) => {
            latitude = value;
        }).then(async () => {
            await driver.findLongitude(city).then((value) => {
                longitude = value;
            });
        }).then(async () => {
            await driver.quit();
        });
    }, 1000);

    return new Promise(async (resolve) => { resolve({ lat: latitude, long: longitude }) })
}

`

01234567890123456789

Jawaban #1

umumnya hindari new Promise. Satu-satunya tujuan untuk ini adalah mengubah kode gaya callback menjadi Promises. Memanggil resolve(...) secara langsung dalam sinkron tidak pernah masuk akal. Untuk ini akan ada Promise.resolve(...).

Juga, sebuah fungsi async selalu secara otomatis mengembalikan Promise. Jadi tidak perlu membuatnya sendiri.

Sekarang, salah satu dari beberapa kasus penggunaan new Promise sebenarnya adalah setTimeout. Trik yang umum adalah ini:

const wait = milliseconds => new Promise(resolve => setTimeout(resolve, milliseconds));

ini memberi Anda fungsi sederhana yang menunggu beberapa waktu, yang dapat Anda tunggu seperti await wait(1000).

Pada langkah berikutnya, penting untuk menyadari bahwa hal-hal ini:

await driver.findLatitude(city).then((value) => {
  latitude = value;
})

100% identik dengan ini:

latitude = await driver.findLatitude(city);

Yang berarti Anda dapat menulis ulang kode Anda seperti ini:

const wait = milliseconds => new Promise(resolve => setTimeout(resolve, milliseconds));

export default async function scrapper(city: string): Promise<Coords> {
  let latitude = "";
  let longitude = "";
  let driver = openDriver();
  await wait(1000);

  latitude = await driver.findLatitude(city)
  longitude = await driver.findLongitude(city);
  await driver.quit();

  return { lat: latitude, long: longitude };
}

Sekarang langkah berikutnya adalah menghapus let, dan menggantinya dengan const.

Jawaban #2

Pertama saya akan menyarankan beberapa hal.

Untuk apa yang kamu minta, kamu perlu membungkus semuanya dalam promise dan menyelesaikannya di setTimeout.

Saya akan menyarankan Anda untuk menggunakan Promise.all() untuk menghemat banyak waktu saat membuat banyak permintaan http.

(gunakan ini hanya jika panggilan yang Anda lakukan tidak saling bergantung satu sama lain)

Seharusnya terlihat seperti ini:

  promiseExample() {

    return new Promise((resolve, reject) => {
      const promiseArray = [];
      const driver = openDriver();
      promiseArray.push(driver.findLatitude(city))
      promiseArray.push(driver.findLongitude(city))
      promiseArray.push(driver.quit()) // if this action not depend on the rest if it does put it inside the then

      Promise.all(promiseArray)
        .then((result) => {
          setTimeout(() => {
            resolve({ lat: result[0], long: result[1] });
          }, 1000) // use here what ever time you want 
        })
    })
  }

atau dengan cara async:

    export default async function scrapper(city: string) {
    let driver = openDriver();
    const promiseArray = []
    promiseArray.push(driver.findLatitude(city));
    promiseArray.push(driver.findLongitude(city));
    // if driver.quit() depened on other then if not the add it like the others 
    const result = await Promise.all(promiseArray);
    await driver.quit();
    setTimeout(() => {
       return { lat: result[0], long: result[1] }
    }, 1000);
}

Menggunakan promise all akan mempercepat permintaan API dan membuat Anda menunggu jauh lebih sedikit. karena Anda mengeksekusinya setelah yang lain dan menunggu semua respons alih-alih mengeksekusi permintaan, menunggu respons, lalu mengeksekusi berikutnya, dll.

Selain itu, Anda harus menerapkan reject (untuk promise) atau menggunakan try catch (untuk async) jika diperlukan.