Apa penutup JavaScript dengan contoh?

Javascript adalah bahasa pemrograman serbaguna yang mendukung berbagai paradigma pemrograman. Salah satu fitur JavaScript yang paling kuat adalah penutupan, yang memungkinkan pengembang untuk membuat kode yang kuat dan fleksibel. Dalam artikel ini, kami akan mengeksplorasi penutupan apa itu dan bagaimana mereka bekerja, bersama dengan beberapa contoh.

Apa penutupan dalam javascript?

Penutupan adalah fungsi dalam yang memiliki akses ke variabel, parameter, dan argumen fungsi luar. Fungsi dalam dapat mengakses variabel -variabel ini bahkan setelah fungsi luar kembali. Penutupan memungkinkan Anda untuk merangkum dan melindungi data dalam suatu fungsi, mencegahnya diakses oleh fungsi lain.

Penutupan dibuat saat fungsi didefinisikan di dalam fungsi lain dan dikembalikan sebagai nilai. Fungsi yang dikembalikan mempertahankan referensi ke variabel dalam fungsi luar, bahkan setelah fungsi luar kembali. Ini berarti bahwa fungsi dalam dapat mengakses dan memanipulasi variabel -variabel tersebut.

Penutupan dapat digunakan dalam berbagai situasi, seperti menciptakan variabel dan metode pribadi, menerapkan panggilan balik dan penangan acara, dan mengelola negara bagian.

Contoh 1: Variabel dan metode pribadi

Salah satu penggunaan penutupan yang paling umum adalah membuat variabel dan metode pribadi. Variabel dan metode pribadi tidak dapat diakses dari luar fungsi, membuatnya lebih aman dan kurang rentan terhadap kesalahan.

function counter () let count = 0; function increment () count ++; menghibur.log (hitung); return increment; const incrementcount = counter (); incrementcount (); // 1 incrementcount (); // 2 incrementCount (); // 3

12345678910111213141516

function counter () let count = 0; function increment () count ++; menghibur.log (hitung); return increment; const incrementcount = counter (); incrementcount (); // 1 incrementcount (); // 2IncrementCount (); // 3

Dalam contoh di atas, kami telah membuat a menangkal fungsi yang mengembalikan fungsi kenaikan. Itu menghitung variabel didefinisikan dalam menangkal fungsi tetapi hanya dapat diakses dari kenaikan fungsi. Setiap kali kenaikan Fungsi disebut, ia meningkatkan variabel penghitungan dan mencatat nilai baru ke konsol.

Contoh 2: Callbacks dan Penangan Acara

Penutupan juga dapat digunakan untuk menerapkan panggilan balik dan penangan acara. Callback adalah fungsi yang disahkan sebagai argumen ke fungsi lain dan dipanggil ketika fungsi lain selesai. Penangan acara adalah fungsi yang dipanggil sebagai tanggapan terhadap acara tertentu, seperti klik tombol atau pengiriman formulir.

function fetchData (url, callback) fetch (url) .Kemudian (respons => respons.json ()) .lalu (data => callback (data)) .catch (error => console.error (error)); fetchData ('https: // api.contoh.com/data ', function (data) konsol.log (data); );

12345678910

function fetchData (url, callback) fetch (url) .Kemudian (respons => respons.json ()) .lalu (data => callback (data)) .catch (error => console.error (error)); fetchData ('https: // api.contoh.com/data ', function (data) konsol.log (data););

Dalam contoh di atas, kami telah membuat a fetchdata fungsi yang mengambil URL dan fungsi panggilan balik sebagai argumen. Itu fetchdata fungsi menggunakan mengambil API untuk mengambil data dari URL yang ditentukan dan kemudian meneruskan data itu ke fungsi panggilan balik. Fungsi panggilan balik didefinisikan sebagai fungsi anonim yang mencatat data ke konsol.

Contoh 3: Status mengelola

Penutupan juga dapat digunakan untuk mengelola negara dalam suatu program. Status mengacu pada data yang menjelaskan kondisi program saat ini, seperti input pengguna atau pengaturan aplikasi.

fungsi createCounter (initialValue = 0) let count = initialValue; return increment () count ++; menghibur.log (hitung); , decrement () count--; menghibur.log (hitung); , reset () count = initialValue; menghibur.log (hitung); ; const counter = createCounter (5); menangkal.kenaikan(); // 6 counter.pengurangan(); // 5 penghitung.mengatur ulang(); // 5

123456789101112131415161718192021222324

fungsi createCounter (initialValue = 0) let count = initialValue; return increment () count ++; menghibur.log (hitung); , decrement () count--; menghibur.log (hitung); , reset () count = initialValue; menghibur.log (hitung); ; const counter = createCounter (5); menangkal.kenaikan(); // 6counter.pengurangan(); // 5counter.mengatur ulang(); // 5

Dalam contoh di atas, kami telah membuat a CreateCounter fungsi yang mengembalikan objek dengan tiga metode: kenaikan, pengurangan, Dan mengatur ulang. Metode mengakses dan memanipulasi variabel penghitungan yang didefinisikan dalam CreateCounter fungsi. Nilai awal dari menghitung diatur ke parameter InitialValue yang diteruskan ke CreateCounter. Setiap metode mengembalikan nilai yang diperbarui dari menghitung dan mencatatnya ke konsol.

Itu menangkal objek dikembalikan oleh CreateCounter mempertahankan referensi ke variabel penghitungan di CreateCounter fungsi, memungkinkan kenaikan, pengurangan, Dan mengatur ulang metode untuk mengakses dan memodifikasi keadaan program.

Kesimpulan

Kesimpulannya, penutupan adalah fitur yang kuat dari JavaScript yang memungkinkan Anda membuat kode yang fleksibel dan aman. Penutupan dibuat saat fungsi didefinisikan di dalam fungsi lain dan dikembalikan sebagai nilai. Fungsi yang dikembalikan mempertahankan referensi ke variabel dalam fungsi luar, bahkan setelah fungsi luar kembali. Penutupan dapat digunakan dalam berbagai situasi, seperti menciptakan variabel dan metode pribadi, menerapkan panggilan balik dan penangan acara, dan mengelola negara bagian. Dengan menggunakan penutupan dalam kode JavaScript Anda, Anda dapat menulis aplikasi yang lebih kuat dan dapat dipelihara.