Memahami JavaScript Sinkronisasi dan Asinkron - Bagian 1

Sinkronis dan tidak sinkron adalah konsep yang membingungkan dalam JavaScript, terutama untuk pemula. Dua hal atau lebih sinkronis ketika mereka terjadi pada saat bersamaan (sinkron), dan asinkron ketika tidak (tidak sinkron).

Meskipun definisi ini mudah untuk dipahami, sebenarnya lebih rumit daripada yang terlihat. Kita harus memperhitungkannya apa yang sebenarnya sinkron, dan apa yang tidak.

Anda mungkin akan memanggil normal berfungsi dalam JavaScript sinkron, bukan? Dan jika itu seperti setTimeout () atau AJAX yang bekerja dengan Anda, Anda akan menyebutnya sebagai tidak sinkron, ya? Bagaimana jika aku memberitahumu itu kedua dengan cara tidak sinkron?

Untuk menjelaskan Mengapa, kita perlu meminta bantuan pada Tuan X.

Skenario 1 - Mr X sedang mencoba sinkronisasi

Berikut pengaturannya:

1. Mr X adalah seseorang yang dapat menjawab pertanyaan sulit, dan melakukan tugas yang diminta.
2. Satu-satunya cara untuk menghubunginya adalah melalui panggilan telepon.
3. Apa pun pertanyaan atau tugas yang Anda dapatkan, untuk meminta bantuan Tuan X untuk melaksanakannya; kamu memanggilnya.
4. Mr X memberi Anda jawaban atau menyelesaikan tugas segera, dan memberi tahu Anda selesai.
5. Anda meletakkan konten perasaan penerima dan pergi keluar untuk film.

Apa yang baru saja Anda lakukan adalah a komunikasi sinkron (bolak-balik) dengan Tuan X. Dia mendengarkan ketika Anda mengajukan pertanyaan kepadanya, dan Anda mendengarkan ketika ia menjawabnya.

Skenario 2 - Tuan X tidak senang dengan sinkronisitas

Karena Tuan X sangat efisien, ia mulai menerima lebih banyak panggilan. Jadi apa yang terjadi ketika Anda memanggilnya tetapi dia sudah sibuk berbicara dengan orang lain? Anda tidak akan dapat mengajukan pertanyaan kepadanya - tidak sampai dia bebas menerima telepon Anda. Yang akan Anda dengar adalah nada sibuk.

Jadi apa yang bisa dilakukan X untuk memerangi ini?

Alih-alih menerima panggilan secara langsung:

1. Tuan X menyewa orang baru, Tuan M dan memberinya mesin penjawab telepon untuk para penelepon untuk meninggalkan pesan.
2. Pekerjaan Mr M adalah untuk menyampaikan pesan dari mesin penjawab ke Tn. X begitu dia tahu Tn. X telah selesai memproses semua pesan sebelumnya dan sudah bebas untuk mengambil yang baru.
3. Jadi sekarang ketika Anda memanggilnya, alih-alih mendapatkan nada sibuk, Anda harus meninggalkan pesan untuk Tuan X, lalu tunggu dia memanggilmu kembali (belum ada waktu film).
4. Setelah Tuan X selesai dengan semua pesan antrian yang diterimanya sebelum Anda, ia akan memeriksa masalah Anda, dan menelepon Anda kembali untuk memberi Anda jawaban.

Sekarang di sinilah pertanyaannya: apakah tindakannya sejauh ini sinkron atau asinkron?

Itu campuran. Ketika Anda meninggalkan pesan Anda, Tuan X tidak mendengarkannya, jadi komunikasi keempatnya tidak sinkron.

Tapi, ketika dia menjawab, Anda ada di sana mendengarkan, yang membuat komunikasi kembali sinkron.

Saya harap sekarang Anda telah memperoleh pemahaman yang lebih baik tentang bagaimana sinkronisitas dipersepsikan dalam hal komunikasi. Saatnya membawa JavaScript.

JavaScript - Bahasa Pemrograman Asinkron

Ketika seseorang memberi label JavaScript sebagai tidak sinkron, apa yang mereka maksudkan secara umum adalah bagaimana Anda bisa tinggalkan pesan untuk itu, dan tidak memblokir panggilan Anda dengan nada sibuk.

Panggilan fungsi adalah tidak pernah mengarahkan dalam JavaScript, mereka benar-benar selesai melalui pesan.

JavaScript menggunakan a antrian pesan tempat pesan masuk (atau acara) diadakan. Sebuah acara-loop (pengirim pesan) secara berurutan mengirimkan pesan-pesan itu ke a sebut tumpukan di mana fungsi yang sesuai dari pesan berada ditumpuk sebagai bingkai (argumen & variabel fungsi) untuk dieksekusi.

Tumpukan panggilan memegang bingkai dari fungsi awal yang dipanggil, dan bingkai lainnya untuk fungsi yang dipanggil melalui panggilan bersarang diatasnya .

Ketika sebuah pesan bergabung dengan antrian, itu menunggu sampai tumpukan panggilan kosongkan semua bingkai dari pesan sebelumnya, dan ketika itu, loop acara Dequeues pesan sebelumnya, dan menambahkan bingkai yang sesuai dari pesan saat ini ke tumpukan panggilan.

Pesan menunggu lagi sampai tumpukan panggilan menjadi kosong dari frame yang sesuai sendiri (mis. eksekusi semua fungsi yang ditumpuk sudah selesai), kemudian dibatalkan.

Pertimbangkan kode berikut:

 function foo ()  function bar () foo ();  function baz () bar ();  baz (); 

Fungsi yang sedang dijalankan adalah baz () (di baris terakhir dari cuplikan kode), untuk itu sebuah pesan ditambahkan ke antrian, dan ketika loop acara mengambilnya, tumpukan panggilan mulai menumpuk frame untuk baz (), bar(), dan foo () pada titik eksekusi yang relevan.

Setelah eksekusi fungsi selesai satu per satu, frame mereka dihapus dari tumpukan panggilan, sementara pesannya adalah masih menunggu dalam antrian, sampai baz () muncul dari tumpukan.

Ingat, pemanggilan fungsi tidak pernah mengarahkan dalam JavaScript, mereka sudah selesai melalui pesan. Jadi, setiap kali Anda mendengar seseorang mengatakan bahwa JavaScript itu sendiri adalah bahasa pemrograman yang tidak sinkron, anggaplah mereka berbicara tentang bawaannya “mesin penjawab”, dan bagaimana Anda bebas meninggalkan pesan.

Tetapi bagaimana dengan metode asinkron tertentu?

Sejauh ini saya belum menyentuh API seperti setTimeout () dan AJAX, itulah yang ada secara khusus disebut sebagai tidak sinkron. Mengapa demikian?

Penting untuk memahami apa yang sebenarnya sinkron atau asinkron. JavaScript, dengan bantuan acara dan loop acara, dapat berlatih pemrosesan pesan tidak sinkron, tapi itu tidak berarti segala sesuatu dalam JavaScript asinkron.

Ingat, saya bilang pesan tidak pergi sampai tumpukan panggilan kosong dari frame yang sesuai, sama seperti Anda tidak pergi untuk menonton film sampai Anda mendapatkan jawaban Anda - itu menjadi sinkron, kamu di sana menunggu sampai tugas selesai, dan Anda mendapatkan jawabannya.

Menunggu tidak ideal di semua skenario. Bagaimana jika setelah meninggalkan pesan, alih-alih menunggu, Anda dapat pergi untuk menonton film? Bagaimana jika suatu fungsi dapat pensiun (mengosongkan tumpukan panggilan), dan pesannya dapat dihapus bahkan sebelum tugas fungsi selesai? Bagaimana jika Anda dapat menjalankan kode secara tidak sinkron?

Di sinilah API seperti setTimeout () dan AJAX muncul, dan apa yang mereka lakukan adalah ... tunggu, saya tidak bisa menjelaskan ini tanpa kembali ke Mr X, yang akan kita lihat di bagian kedua artikel ini. Tetap disini.