Rumah  >  Artikel  >  hujung hadapan web  >  Fahami penutupan js dalam satu minit_javascript kemahiran

Fahami penutupan js dalam satu minit_javascript kemahiran

WBOY
WBOYasal
2016-05-16 15:02:201272semak imbas

Apakah itu penutupan?
Lihat sekeping kod dahulu:

function a(){
  var n = 0;
  function inc() {
    n++;
    console.log(n);
  }
  inc(); 
  inc(); 
}
a(); //控制台输出1,再输出2

Pastikan ia mudah. Mari lihat sekeping kod sekali lagi:

function a(){
  var n = 0;
  this.inc = function () {
    n++; 
    console.log(n);
  };
}
var c = new a();
c.inc();  //控制台输出1
c.inc();  //控制台输出2

Pastikan ia mudah.

Apakah itu penutupan? Ini adalah penutupan!

Fungsi yang mempunyai akses kepada pembolehubah dalam skop fungsi lain ialah penutupan. Di sini fungsi inc mengakses pembolehubah n dalam pembina a, jadi penutupan terbentuk.

Lihat sekeping kod sekali lagi:

function a(){
  var n = 0;
  function inc(){
    n++; 
    console.log(n);
  }
  return inc;
}
var c = a();
c();  //控制台输出1
c();  //控制台输出2

Lihat cara ia berfungsi:

var c = couter(), ayat ini couter() mengembalikan fungsi inc, maka ayat ini bersamaan dengan var c = inc;

c(), ayat ini bersamaan dengan inc(); Perhatikan bahawa , nama fungsi hanyalah pengecam (penunjuk kepada fungsi), dan () ialah fungsi pelaksanaan.

Terjemahan bagi tiga ayat seterusnya ialah: var c = inc();, adakah ia berbeza daripada kod pertama? Tidak.

Apakah itu penutupan? Ini adalah penutupan!

Semua tutorial buku teks suka menggunakan perenggan terakhir untuk menerangkan penutupan, tetapi saya fikir ini merumitkan masalah. Apa yang dikembalikan di sini ialah nama fungsi Pelajar yang belum melihat pengaturcaraan C/C++ Tan Haoqiang mungkin tidak segera menyedari perbezaan antara menggunakan () dengan kata lain, kaedah penulisan ini mempunyai perangkapnya sendiri. Walaupun cara penulisan ini lebih elegan, saya masih suka memudahkan masalah Lihat kod 1 dan kod 2. Adakah anda masih keliru tentang panggilan fungsi Adakah anda keliru tentang nilai n?

Mengapa anda menulisnya seperti ini?
Kami tahu bahawa setiap fungsi js adalah bilik gelap kecil Ia boleh mendapatkan maklumat dari dunia luar, tetapi dunia luar tidak dapat melihat secara langsung kandungan di dalamnya. Masukkan pembolehubah n ke dalam bilik hitam kecil Kecuali untuk fungsi inc, tiada cara lain untuk mengakses pembolehubah n Selain itu, mentakrifkan pembolehubah n dengan nama yang sama di luar fungsi a tidak mempengaruhi satu sama lain "enkapsulasi" .

Sebab pulangan digunakan untuk mengembalikan inc pengecam fungsi adalah kerana fungsi inc tidak boleh dipanggil terus di luar fungsi, jadi return inc dipautkan ke bahagian luar. Ini dalam kod 2 juga memautkan inc ke luar.

Perangkap Biasa
Lihat ini:

function createFunctions(){
  var result = new Array();
  for (var i=0; i < 10; i++){
    result[i] = function(){
      return i;
    };
  }
  return result;
}
var funcs = createFunctions();
for (var i=0; i < funcs.length; i++){
  console.log(funcs[i]());
}

Pada pandangan pertama, saya fikir ia akan mengeluarkan 0~9, tetapi saya tidak pernah fikir ia akan mengeluarkan 10 10s?

Perangkap di sini ialah: Fungsi dengan () ialah fungsi pelaksanaan! Ayat mudah seperti var f = function() { alert('Hi' }); dilaksanakan. Terjemahan kod di atas ialah:

var result = new Array(), i;
result[0] = function(){ return i; }; //没执行函数,函数内部不变,不能将函数内的i替换!
result[1] = function(){ return i; }; //没执行函数,函数内部不变,不能将函数内的i替换!
...
result[9] = function(){ return i; }; //没执行函数,函数内部不变,不能将函数内的i替换!
i = 10;
funcs = result;
result = null;

console.log(i); // funcs[0]()就是执行 return i 语句,就是返回10
console.log(i); // funcs[1]()就是执行 return i 语句,就是返回10
...
console.log(i); // funcs[9]()就是执行 return i 语句,就是返回10

Mengapa hanya hasil yang dikumpul tetapi tidak saya? Kerana saya masih dirujuk oleh fungsi. Seperti restoran, pinggan sentiasa terhad, jadi pelayan akan meronda di meja untuk mengambil pinggan kosong, tetapi beranikah dia mengutip pinggan yang masih mengandungi sayur? Sudah tentu, jika anda mengosongkan hidangan secara manual di atas pinggan (=null), pinggan itu akan dibawa pergi Ini adalah mekanisme kitar semula memori.

Mengenai bagaimana nilai i masih boleh dikekalkan, sebenarnya, selepas membaca sepanjang jalan dari awal artikel, tiada apa yang perlu dirisaukan. Bukankah sekeping makanan di atas pinggan sepatutnya hilang selepas makan sekeping?

Untuk meringkaskan
Penutupan ialah fungsi yang merujuk kepada pembolehubah fungsi lain Kerana pembolehubah dirujuk, ia tidak akan dikitar semula, jadi ia boleh digunakan untuk merangkum pembolehubah persendirian. Ini adalah kelebihan dan kekurangan Penutupan yang tidak perlu hanya akan meningkatkan penggunaan memori! Selain itu, apabila menggunakan penutupan, anda juga harus memberi perhatian kepada sama ada nilai pembolehubah memenuhi keperluan anda, kerana ia seperti pembolehubah peribadi statik. Penutupan biasanya bercampur dengan banyak perkara Hanya dengan menghubungi mereka anda boleh mendalami pemahaman anda Di sini hanyalah permulaan untuk bercakap tentang perkara asas.

Pautan ke artikel ini: http://www.cnblogs.com/qieguo/p/5457040.html

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu kajian semua orang.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn