Memahami Penutupan dalam JavaScript: Konsep Utama untuk 4

Penutupan ialah konsep asas dalam JavaScript, namun ia boleh menjadi sukar untuk difahami pada mulanya. Mereka membenarkan fungsi untuk mengekalkan akses kepada pembolehubah daripada skop induknya, walaupun selepas fungsi induk selesai melaksanakan. Dalam siaran ini, kami akan membahagikan cara penutupan berfungsi dan cara anda boleh memanfaatkannya dalam kod anda.

Apakah itu Penutupan?
Penutupan dibuat apabila fungsi ditakrifkan di dalam fungsi lain, membenarkan fungsi dalaman mengakses pembolehubah fungsi luar. Walaupun selepas fungsi luar selesai dilaksanakan, fungsi dalam masih "mengingat" pembolehubah tersebut.

Contoh:

function outerFunction(outerVar) {
  return function innerFunction(innerVar) {
    console.log(`Outer: ${outerVar}, Inner: ${innerVar}`);
  };
}

const newFunction = outerFunction('outside');
newFunction('inside');  // Output: Outer: outside, Inner: inside

Mengapa Penutupan Berguna?
Penutupan membenarkan corak berkuasa seperti pengkapsulan data, kilang fungsi dan pengendalian acara. Ia membantu mewujudkan keadaan peribadi dalam fungsi, menjadikan kod anda lebih modular dan cekap.

Kes Penggunaan Biasa Penutupan

• Pembolehubah Peribadi: Penutupan boleh membantu mencipta pembolehubah peribadi, yang hanya boleh diakses oleh fungsi yang dibuat di dalam penutupan:

function counter() {
  let count = 0;
  return function() {
    count++;
    console.log(count);
  };
}

const increment = counter();
increment();  // 1
increment();  // 2

• Kari: Penutupan membenarkan fungsi kari, di mana fungsi dipecahkan kepada beberapa fungsi yang lebih kecil:

function multiply(a) {
  return function(b) {
    return a * b;
  };
}

const double = multiply(2);
console.log(double(5));  // 10

Pendengar dan Panggilan Balik Acara
Penutupan sering digunakan dalam pendengar acara dan fungsi panggil balik, membantu mengekalkan akses kepada pembolehubah penting apabila peristiwa dicetuskan kemudian waktunya.
Contoh:

function setupEvent(elementId) {
  let count = 0;
  document.getElementById(elementId).addEventListener('click', function() {
    count++;
    console.log(`Button clicked ${count} times`);
  });
}

setupEvent('myButton');

Kesimpulan
Penutupan ialah bahagian penting JavaScript dan alat yang berkuasa untuk mengurus keadaan dan tingkah laku dalam kod anda. Menguasainya akan membantu anda menulis JavaScript yang lebih cekap, modular dan fleksibel pada tahun 2024.

Terima kasih kerana membaca! Beritahu saya dalam ulasan jika anda mempunyai sebarang soalan atau contoh tentang cara anda menggunakan penutupan dalam projek anda sendiri.??
Lawati tapak web saya:https://shafayet.zya.me

Atas ialah kandungan terperinci Memahami Penutupan dalam JavaScript: Konsep Utama untuk 4. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!