Bagaimana saya bisa menggunakan async / menunggu di tingkat atas?

Saya telah membahas async/ awaitdan setelah mempelajari beberapa artikel, saya memutuskan untuk mengujinya sendiri. Namun, sepertinya saya tidak bisa memahami mengapa ini tidak berhasil:

async function main() {  
    var value = await Promise.resolve('Hey there');
    console.log('inside: ' + value);
    return value;
}

var text = main();  
console.log('outside: ' + text);

Konsol menampilkan yang berikut (simpul v8.6.0):

> luar: [Janji objek]

> di dalam: Hei di sana

Mengapa pesan log di dalam fungsi dijalankan setelah itu? Saya pikir alasan async/ awaitdiciptakan adalah untuk melakukan eksekusi sinkron menggunakan tugas asinkron.

Apakah ada cara saya bisa menggunakan nilai yang dikembalikan di dalam fungsi tanpa menggunakan .then()after main()?

Sepertinya saya tidak bisa membungkus kepala saya mengapa ini tidak berhasil.

Karena mainmengembalikan janji; semua asyncfungsi lakukan.

Di tingkat atas, Anda harus:

1. Gunakan asyncfungsi tingkat atas yang tidak pernah menolak (kecuali jika Anda ingin kesalahan "penolakan ditangani"), atau

2. Gunakan thendan catch, atau

3. (Segera hadir!) Gunakan level-atasawait , proposal yang telah mencapai Tahap 3 dalam proses yang memungkinkan penggunaan level-atas awaitdalam sebuah modul.

# 1 - asyncFungsi tingkat atas yang tidak pernah ditolak

(async () => {
    try {
        var text = await main();
        console.log(text);
    } catch (e) {
        // Deal with the fact the chain failed
    }
})();

Perhatikan catch; Anda harus menangani penolakan janji / pengecualian async, karena tidak ada hal lain yang terjadi; Anda tidak memiliki penelepon untuk meneruskannya. Jika Anda mau, Anda bisa melakukan itu dengan memanggilnya melalui catchfungsi (bukan try/ catchsintaks):

(async () => {
    var text = await main();
    console.log(text);
})().catch(e => {
    // Deal with the fact the chain failed
});

... yang sedikit lebih ringkas (saya suka karena alasan itu).

Atau, tentu saja, jangan menangani kesalahan dan biarkan kesalahan "unhandled rejection".

# 2 - thendancatch

main()
    .then(text => {
        console.log(text);
    })
    .catch(err => {
        // Deal with the fact the chain failed
    });

The catchhandler akan dipanggil jika terjadi kesalahan dalam rantai atau di Anda thenhandler. (Pastikan catchpawang Anda tidak melakukan kesalahan, karena tidak ada yang terdaftar untuk menanganinya.)

Atau keduanya argumen untuk then:

main().then(
    text => {
        console.log(text);
    },
    err => {
        // Deal with the fact the chain failed
    }
);

Sekali lagi perhatikan kami mendaftarkan penangan penolakan. Tetapi dalam formulir ini, pastikan bahwa kedua thencallback Anda tidak melakukan kesalahan, tidak ada yang terdaftar untuk menanganinya.

Level 3 teratas awaitdalam modul

Kamu tidak bisa menggunakan await di tingkat atas skrip non-modul, tetapi proposal tingkat atasawait ( Tahap 3 ) memungkinkan Anda untuk menggunakannya di tingkat atas modul. Ini mirip dengan menggunakan asyncpembungkus fungsi tingkat atas (# 1 di atas) karena Anda tidak ingin kode tingkat atas Anda ditolak (melempar kesalahan) karena itu akan menghasilkan kesalahan penolakan yang tidak tertangani. Jadi, kecuali jika Anda ingin memiliki penolakan yang tidak ditangani ketika ada masalah, seperti dengan # 1, Anda ingin membungkus kode Anda dalam penangan kesalahan:

// In a module, once the top-level `await` proposal lands
try {
    var text = await main();
    console.log(text);
} catch (e) {
    // Deal with the fact the chain failed
}

Perhatikan bahwa jika Anda melakukan ini, modul apa pun yang mengimpor dari modul Anda akan menunggu sampai janji Anda await selesai; ketika sebuah modul yang menggunakan tingkat atas awaitdievaluasi, pada dasarnya ia mengembalikan janji kepada pemuat modul (seperti halnya asyncfungsi), yang menunggu sampai janji itu diselesaikan sebelum mengevaluasi isi modul apa pun yang bergantung padanya.

Tingkat Atasawait telah pindah ke tahap 3, jadi jawaban untuk pertanyaan Anda Bagaimana saya bisa menggunakan async / menunggu di tingkat atas? adalah dengan hanya menambahkan awaitpanggilan ke main():

async function main() {  
    var value = await Promise.resolve('Hey there');
    console.log('inside: ' + value);
    return value;
}

var text = await main();  
console.log('outside: ' + text)

Atau hanya:

const text = await Promise.resolve('Hey there');
console.log('outside: ' + text)

Perlu diingat bahwa itu masih hanya tersedia di Webpack@v5.0.0-alpha.15 .

Jika Anda menggunakan TypeScript , itu mendarat di 3.8 .

v8 telah menambahkan dukungan dalam modul.

Ini juga didukung oleh Deno (seperti dikomentari oleh gonzalo-bahamondez).

Solusi aktual untuk masalah ini adalah dengan mendekatinya secara berbeda.

Mungkin tujuan Anda adalah semacam inisialisasi yang biasanya terjadi di tingkat atas aplikasi.

Solusinya adalah untuk memastikan bahwa hanya ada satu pernyataan JavaScript tunggal di tingkat atas aplikasi Anda. Jika Anda hanya memiliki satu pernyataan di bagian atas aplikasi Anda, maka Anda bebas untuk menggunakan async / menunggu di setiap titik lain di mana saja (tunduk pada aturan sintaksis yang normal)

Dengan kata lain, bungkus seluruh tingkat teratas Anda dalam suatu fungsi sehingga tidak lagi tingkat atas dan yang memecahkan pertanyaan tentang bagaimana menjalankan async / menunggu di tingkat atas aplikasi - Anda tidak.

Seperti inilah tampilan level teratas aplikasi Anda:

import {application} from './server'

application();

Untuk memberikan info lebih lanjut di atas jawaban saat ini:

Isi node.jsfile saat ini digabungkan, dengan cara seperti string, untuk membentuk fungsi tubuh.

Misalnya jika Anda memiliki file test.js:

// Amazing test file!
console.log('Test!');

Kemudian node.jsdiam-diam akan menggabungkan fungsi yang terlihat seperti:

function(require, __dirname, ... a bunch more top-level properties) {
  // Amazing test file!
  console.log('test!');
}

Hal utama yang perlu diperhatikan, adalah bahwa fungsi yang dihasilkan BUKAN fungsi async. Jadi, Anda tidak dapat menggunakan istilah itu awaitlangsung di dalamnya!

Tetapi katakan Anda perlu bekerja dengan janji-janji di file ini, maka ada dua metode yang mungkin:

1. Jangan gunakan await langsung di dalam fungsi
2. Jangan gunakan await

Opsi 1 mengharuskan kami untuk membuat ruang lingkup baru (dan ruang lingkup ini bisa async, karena kami memiliki kendali atas itu):

// Amazing test file!
// Create a new async function (a new scope) and immediately call it!
(async () => {
  await new Promise(...);
  console.log('Test!');
})();

Opsi 2 mengharuskan kita untuk menggunakan API janji berorientasi objek (paradigma yang kurang cantik namun fungsional untuk bekerja dengan janji)

// Amazing test file!
// Create some sort of promise...
let myPromise = new Promise(...);

// Now use the object-oriented API
myPromise.then(() => console.log('Test!'));

Saya pribadi berharap bahwa, jika bisa diterapkan, node.js akan secara default menggabungkan kode menjadi suatu asyncfungsi. Itu akan menghilangkan sakit kepala ini.

Menunggu level atas adalah fitur standar EcmaScript yang akan datang. Saat ini, Anda dapat mulai menggunakannya dengan TypeScript 3.8 (dalam versi RC saat ini).

Cara Memasang TypeScript 3.8

Anda dapat mulai menggunakan TypeScript 3.8 dengan menginstalnya dari npm menggunakan perintah berikut:

$ npm install typescript@rc

Pada saat ini, Anda perlu menambahkan rctag untuk menginstal naskah versi 3.8 terbaru.

Karena main()berjalan secara tidak sinkron, ia mengembalikan janji. Anda harus mendapatkan hasilnya dalam then()metode. Dan karena then()mengembalikan janji juga, Anda harus menelepon process.exit()untuk mengakhiri program.

main()
   .then(
      (text) => { console.log('outside: ' + text) },
      (err)  => { console.log(err) }
   )
   .then(() => { process.exit() } )