Mesin JavaScript (yang ditemukan di lingkungan hosting seperti browser), adalah juru bahasa utas tunggal yang terdiri dari tumpukan dan tumpukan panggilan tunggal. Browser menyediakan API web seperti DOM, AJAX, dan Timer
Artikel ini bertujuan untuk menjelaskan apa itu tumpukan panggilan dan mengapa itu diperlukan. Pemahaman tentang tumpukan panggilan akan memberikan kejelasan tentang cara kerja "hierarki fungsi dan urutan eksekusi" di mesin JavaScript
Tumpukan panggilan terutama digunakan untuk pemanggilan fungsi (panggilan). Karena tumpukan panggilan tunggal, eksekusi fungsi, dilakukan, satu per satu, dari atas ke bawah. Ini berarti tumpukan panggilan sinkron
Pemahaman tentang tumpukan panggilan sangat penting untuk pemrograman Asinkron (yang akan kita lihat di artikel selanjutnya)
Dalam Asynchronous JavaScript, kami memiliki fungsi callback, event loop, dan task queue. Fungsi callback ditindaklanjuti oleh stack panggilan selama eksekusi setelah fungsi callback didorong ke stack oleh event loop
Tapi sebelum kita melompati senjata, pertama-tama mari kita coba menjawab pertanyaan - Apa tumpukan panggilan itu?
Pada tingkat paling dasar, tumpukan panggilan adalah struktur data yang menggunakan prinsip Last In, First Out (LIFO) untuk menyimpan dan mengelola pemanggilan fungsi (panggilan) sementara
Mari kita uraikan definisi kita
LIFO. Ketika kita mengatakan bahwa tumpukan panggilan, beroperasi dengan prinsip struktur data Masuk Terakhir, Keluar Pertama, itu berarti bahwa fungsi terakhir yang didorong ke dalam tumpukan adalah yang pertama keluar, saat fungsi tersebut kembali
Mari kita lihat contoh kode untuk mendemonstrasikan LIFO dengan mencetak kesalahan pelacakan tumpukan ke konsol
Saat kode dijalankan, kami mendapatkan kesalahan. Tumpukan dicetak menunjukkan bagaimana fungsi ditumpuk di atas satu sama lain. Lihatlah diagramnya
Kesalahan pelacakan tumpukanAnda akan melihat bahwa pengaturan fungsi sebagai tumpukan dimulai dengan firstFunction() (yang merupakan fungsi terakhir yang masuk ke tumpukan, dan muncul keluar untuk membuang kesalahan), diikuti oleh secondFunction(), dan kemudian thirdFunction() (yaitu
Simpan sementara. Ketika suatu fungsi dipanggil (dipanggil), fungsi, parameternya, dan variabel didorong ke tumpukan panggilan untuk membentuk bingkai tumpukan. Bingkai tumpukan ini adalah lokasi memori dalam tumpukan. Memori dihapus saat fungsi kembali saat dikeluarkan dari tumpukan
Kredit Gambar. CMUKelola pemanggilan fungsi (panggilan). Tumpukan panggilan menyimpan catatan posisi setiap bingkai tumpukan. Ia mengetahui fungsi selanjutnya yang akan dieksekusi (dan akan menghapusnya setelah eksekusi). Inilah yang membuat eksekusi kode dalam JavaScript menjadi sinkron
Pikirkan diri Anda sedang berdiri di antrian, di toko kelontong tunai. Anda hanya dapat dilayani setelah orang di depan Anda dilayani. Itu sinkron
Inilah yang kami maksud dengan "mengelola pemanggilan fungsi"
Bagaimana tumpukan panggilan menangani panggilan fungsi?
Kami akan menjawab pertanyaan ini dengan melihat contoh kode dari suatu fungsi yang memanggil fungsi lain. Ini contoh kodenya
function firstFunction(){ console.log("Hello from firstFunction"); } function secondFunction(){ firstFunction(); console.log("The end from secondFunction"); } secondFunction();Ini hasilnyaInilah yang terjadi ketika kode dijalankan
1. Saat secondFunction()_ dieksekusi, bingkai tumpukan kosong dibuat. Ini adalah titik masuk utama (anonim) dari program
2. secondFunction() lalu panggil firstFunction()yang didorong ke dalam tumpukan
3. firstFunction() mengembalikan dan mencetak “Hello from firstFunction” ke konsol
4. firstFunction()_ keluar dari tumpukan
5. Perintah eksekusi kemudian pindah ke secondFunction()
6. secondFunction() mengembalikan dan mencetak "The end from secondFunction" ke konsol
7. secondFunction() dikeluarkan dari tumpukan, membersihkan memori
Apa yang menyebabkan stack overflow?
Stack overflow terjadi ketika ada fungsi rekursif (fungsi yang memanggil dirinya sendiri) tanpa titik keluar. Peramban (lingkungan hosting) memiliki panggilan tumpukan maksimum yang dapat diakomodasi sebelum melontarkan kesalahan tumpukan
Ini sebuah contoh
function callMyself(){ callMyself(); } callMyself();function firstFunction(){ console.log("Hello from firstFunction"); } function secondFunction(){ firstFunction(); console.log("The end from secondFunction"); } secondFunction();4 akan berjalan sampai browser melontarkan "Ukuran panggilan maksimum terlampaui". Dan itu adalah stack overflow
Kesalahan tumpukan panggilan maksimumkesimpulan
Kunci takeaways dari tumpukan panggilan adalah
1. Ini adalah utas tunggal. Artinya hanya dapat melakukan satu hal pada satu waktu
2. Eksekusi kode sinkron
3. Pemanggilan fungsi membuat bingkai tumpukan yang menempati memori sementara
4. Ini berfungsi sebagai struktur data LIFO — Last In, First Out
Kami telah menggunakan artikel tumpukan panggilan untuk meletakkan dasar bagi seri yang akan kami lihat di Asynchronous JavaScript (yang akan kami lihat di artikel lain)
Semua contoh kode dapat ditemukan di repo GitHub ini
Terima kasih telah membaca. Jika artikel ini membantu tolong beri tepuk tangan? . Saya juga ingin membaca komentar Anda
IKLAN
IKLAN
IKLAN
IKLAN
Baca lebih banyak posting
Jika Anda membaca sejauh ini, tweet ke penulis untuk menunjukkan bahwa Anda peduli. Tweet terima kasih
Belajar kode secara gratis. Kurikulum open source freeCodeCamp telah membantu lebih dari 40.000 orang mendapatkan pekerjaan sebagai pengembang. Memulai