Penutupan dalam JavaScript adalah fungsi yang mempunyai akses kepada pembolehubah di ruang leksikal luar (melampirkan) leksikal, walaupun selepas fungsi luar telah dikembalikan. Ciri ini membolehkan fungsi untuk "ingat" persekitaran di mana ia dicipta, yang membawa kepada corak kod yang kuat dan fleksibel.
Untuk memahami penutupan, pertimbangkan contoh berikut:
<code class="javascript">function outerFunction(x) { let y = 10; function innerFunction() { console.log(xy); } return innerFunction; } const closureExample = outerFunction(5); closureExample(); // Outputs: 15</code>
Dalam contoh ini, innerFunction
adalah penutupan kerana ia boleh mengakses pembolehubah x
dan y
dari skop outerFunction
, walaupun selepas outerFunction
selesai.
Penutupan boleh digunakan dengan berkesan dalam beberapa cara:
Walaupun penutupan berkuasa, mereka juga boleh membawa kepada beberapa perangkap biasa:
Tingkah laku yang tidak dijangka disebabkan oleh pelaksanaan tidak segerak : Penutupan boleh menyebabkan hasil yang tidak dijangka jika tidak digunakan dengan teliti dalam konteks tak segerak. Kesilapan yang sama menggunakan pembolehubah gelung secara langsung dalam penutupan, mengakibatkan semua penutupan yang merujuk nilai yang sama (akhir) pembolehubah gelung.
<code class="javascript">for (var i = 0; i </code>
Untuk mengelakkan ini, anda boleh menggunakan IIFE atau let
untuk menangkap nilai pembolehubah gelung pada setiap lelaran.
Penutupan dapat meningkatkan privasi dan enkapsulasi dalam aplikasi JavaScript dengan membenarkan pemaju membuat pembolehubah dan kaedah swasta yang tidak dapat diakses dari luar penutupan. Ini amat berguna dalam pengaturcaraan berorientasikan objek dan corak reka bentuk modular.
Pertimbangkan contoh berikut modul kaunter menggunakan penutupan:
<code class="javascript">function createCounter() { let count = 0; return { increment: function() { count ; }, getCount: function() { return count; } }; } const counter = createCounter(); counter.increment(); console.log(counter.getCount()); // Outputs: 1 console.log(counter.count); // Outputs: undefined, because 'count' is private</code>
Dalam contoh ini, count
adalah pemboleh ubah peribadi yang hanya boleh diakses dan diubahsuai melalui kaedah increment
dan getCount
. Pengekalan ini menghalang manipulasi langsung count
dari luar penutupan, meningkatkan privasi data.
Penutupan memudahkan penciptaan kod modular seperti ini di mana keadaan dalaman dapat diuruskan secara persendirian, yang membawa kepada aplikasi yang lebih bersih dan lebih diselenggara.
Kilang fungsi adalah penggunaan praktikal penutupan yang membolehkan anda membuat fungsi dengan tetapan atau tingkah laku pra-konfigurasi. Berikut adalah beberapa contoh:
Kilang fungsi pembalakan :
<code class="javascript">function createLogger(prefix) { return function(message) { console.log(`${prefix}: ${message}`); }; } const errorLogger = createLogger('ERROR'); const infoLogger = createLogger('INFO'); errorLogger('Something went wrong'); // Outputs: ERROR: Something went wrong infoLogger('Everything is fine'); // Outputs: INFO: Everything is fine</code>
Dalam contoh ini, createLogger
adalah kilang fungsi yang mengembalikan fungsi pembalakan dengan awalan pra-konfigurasi.
Kilang Kalkulator :
<code class="javascript">function createCalculator(operation) { return function(a, b) { return operation(a, b); }; } const add = createCalculator((a, b) => ab); const multiply = createCalculator((a, b) => a * b); console.log(add(2, 3)); // Outputs: 5 console.log(multiply(2, 3)); // Outputs: 6</code>
Di sini, createCalculator
adalah kilang yang menghasilkan fungsi kalkulator berdasarkan operasi yang disediakan.
Kilang Tamat :
<code class="javascript">function createTimeout(delay) { return function(callback) { setTimeout(callback, delay); }; } const shortTimeout = createTimeout(1000); const longTimeout = createTimeout(5000); shortTimeout(() => console.log('Short timeout')); longTimeout(() => console.log('Long timeout'));</code>
Dalam contoh ini, createTimeout
adalah kilang yang mengembalikan fungsi untuk menetapkan masa tamat dengan kelewatan yang telah ditetapkan.
Contoh -contoh ini menunjukkan bagaimana penutupan boleh digunakan untuk mencipta corak kod yang serba boleh dan boleh diguna semula, yang membolehkan pemaju menyesuaikan fungsi kepada keperluan khusus sambil mengekalkan struktur kod yang bersih dan modular.
Atas ialah kandungan terperinci Apakah penutupan dalam JavaScript, dan bagaimanakah ia boleh digunakan dengan berkesan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!