Apakah Penutupan dalam JavaScript & Bagaimana Cara Ini Berfungsi?



Penutupan dalam JavaScript dibuat setiap kali fungsi dibuat, pada waktu pembuatan fungsi. Ini memberikan kawalan yang lebih baik terhadap kod ketika menggunakannya.

adalah bahasa yang berorientasikan fungsi yang memberi banyak kebebasan kepada pengguna. Anda boleh membuat fungsi secara dinamik, menyalinnya ke pemboleh ubah lain atau meneruskan sebagai argumen ke fungsi lain dan memanggil dari tempat lain kemudian. Penutupan dalam JavaScript dibuat setiap kali fungsi dibuat, pada waktu pembuatan fungsi. Dalam artikel ini, kita akan memahami penutupan dalam urutan berikut:

Pengenalan Penutupan dalam JavaScript

Penutupan adalah gabungan antara a fungsi digabungkan bersama dengan rujukan ke keadaan sekitarnya iaitu persekitaran leksikal. Dengan kata lain, penutupan memberi anda akses dari fungsi dalaman ke ruang lingkup fungsi luar.





coder - penutupan dalam javascript - edureka

seni bina mvc di java dengan rajah

Sebilangan besar Pembangun menggunakan penutupan dalam JavaScript secara sedar atau tidak. Ini memberikan kawalan yang lebih baik terhadap kod ketika menggunakannya. Selain itu, ia adalah soalan yang paling kerap diajukan .



Contoh:

function foo () {var x = 10 function inner () {return x} return inner} var get_func_inner = foo () console.log (get_func_inner ()) console.log (get_func_inner ()) console.log (get_func_inner ())

Pengeluaran:

10
10
10



Di sini, anda boleh mengakses pemboleh ubah x yang didefinisikan dalam fungsi foo () melalui fungsi dalaman () sebagai yang terakhir mengekalkan rantai skop fungsi penutup pada saat pelaksanaan fungsi penutup. Oleh itu, fungsi dalaman mengetahui nilai x melalui rantai skopnya. Ini adalah bagaimana anda boleh menggunakan penutupan dalam JavaScript.

Penutupan Praktikal

Penutupan membolehkan anda mengaitkan persekitaran leksikal dengan fungsi yang beroperasi pada data tersebut. Ini mempunyai persamaan yang jelas pengaturcaraan berorientasikan objek , di mana objek membolehkan kita mengaitkan sifat objek dengan satu atau lebih kaedah.

Oleh itu, anda boleh menggunakan penutupan di mana sahaja anda biasanya menggunakan objek dengan satu kaedah sahaja.

Contoh:

function makeSizer (size) {return function () {document.body.style.fontSize = size + 'px'}} var size12 = makeSizer (12) var size14 = makeSizer (14) var size16 = makeSizer (16)

Contoh di atas biasanya dilampirkan sebagai panggilan balik: fungsi tunggal yang dilaksanakan sebagai tindak balas terhadap peristiwa tersebut.

Rantai Skop

Penutupan dalam JavaScript mempunyai tiga ruang lingkup seperti:

  • Skop Tempatan
  • Skop Fungsi Luar
  • Skop Global

Kesalahan yang biasa dilakukan adalah tidak menyedari bahawa, sekiranya fungsi luar adalah fungsi yang bersarang, akses ke ruang lingkup fungsi luar merangkumi ruang lingkup fungsi luar yang merangkumi, dengan berkesan membuat rangkaian lingkup fungsi.

// skop global var x = 10 fungsi jumlah (a) {fungsi kembali (b) {fungsi kembali (c) {// fungsi luar skop fungsi kembali (d) {// skop tempatan mengembalikan a + b + c + d + x}}}} console.log (jumlah (1) (2) (3) (4)) // log 20

Ia juga boleh ditulis tanpa fungsi tanpa nama:

// global lingkup var x = 10 fungsi fungsi (a) {return function sum2 (b) {return function sum3 (c) {// fungsi luar lingkup return function sum4 (d) {// local lingkup return a + b + c + d + x}}}} var s = jumlah (1) var s1 = s (2) var s2 = s1 (3) var s3 = s2 (4) konsol.log (s3) // log 20

Dalam contoh di atas, terdapat serangkaian fungsi bersarang yang semuanya mempunyai akses ke ruang lingkup luar fungsi. Oleh itu, anda boleh mengatakan bahawa penutupan mempunyai akses ke semua ruang lingkup fungsi luar di mana ia dinyatakan.

Penutupan Dalam Gelung

Anda boleh menggunakan penutupan dalam JavaScript untuk menyimpan fungsi tanpa nama di setiap indeks susunan . Mari kita ambil contoh dan lihat bagaimana penutupan digunakan dalam satu gelung.

Contoh:

fungsi luar () {var arr = [] var i untuk (i = 0 i<3 i++) { // storing anonymus function arr[i] = function () { return i } } // returning the array. return arr } var get_arr = outer() console.log(get_arr[0]()) console.log(get_arr[1]()) console.log(get_arr[2]())

Pengeluaran:

3
3
3
3

cara menyatakan pelbagai objek dalam java

Dengan ini, kami telah sampai ke akhir artikel kami. Saya harap anda memahami bagaimana penutupan dalam JavaScript berfungsi dan bagaimana ia digunakan untuk mendapatkan kawalan kod yang lebih baik.

Sekarang setelah anda mengetahui tentang Penutupan dalam JavaScript, lihat oleh Edureka. Latihan Pensijilan Pembangunan Web akan membantu anda Mempelajari cara membuat laman web yang mengagumkan menggunakan HTML5, CSS3, Twitter Bootstrap 3, jQuery dan Google API dan menyebarkannya ke Amazon Simple Storage Service (S3).

Ada soalan untuk kami? Sila sebutkan di bahagian komen 'Penutupan dalam JavaScript' dan kami akan menghubungi anda.