Penjelasan terperinci tentang penggunaan js closure_Pengetahuan asas

Mari kita lihat kegunaan penutupan. Sebenarnya, dengan menggunakan penutupan, kita boleh melakukan banyak perkara. Sebagai contoh, ia boleh mensimulasikan gaya pengekodan berorientasikan objek dalam beberapa aspek;

1 fungsi laksana sendiri tanpa nama

Kami mengetahui semua pembolehubah jika anda tidak menambah kata kunci var, ia akan ditambahkan pada sifat objek global secara lalai Terdapat banyak kelemahan untuk menambahkan pembolehubah sementara tersebut pada objek global,
Contohnya: fungsi lain mungkin menyalahgunakan pembolehubah ini menyebabkan objek global menjadi terlalu besar dan menjejaskan kelajuan capaian (kerana nilai pembolehubah perlu dilalui daripada rantaian prototaip).
Selain menggunakan kata kunci var setiap kali pembolehubah digunakan, kita sering menghadapi situasi sedemikian dalam situasi sebenar, iaitu, sesetengah fungsi hanya perlu dilaksanakan sekali dan pembolehubah dalaman mereka tidak perlu dikekalkan
Contohnya, untuk permulaan UI, kita boleh menggunakan penutupan:

Salin kod Kod adalah seperti berikut:

var datamodel = { 
jadual: [],
pokok : {}
}; 
 
(fungsi(dm){ 
untuk(var i = 0; i < dm.table.rows; i ){
      baris var = dm.table.rows[i];                             untuk(var j = 0; j < row.cells; i ){
             drawCell(i, j);                                                                                                           }  
                           
//bina dm.tree
})(model data);



Kami mencipta fungsi tanpa nama dan melaksanakannya dengan segera Memandangkan pembolehubah di dalamnya tidak boleh dirujuk dari luar,

Oleh itu, ia akan dikeluarkan tidak lama lagi selepas pelaksanaan Perkara utama ialah mekanisme ini tidak akan mencemarkan objek global.

2 cache

Mari kita lihat contoh lain. Bayangkan kita mempunyai objek fungsi yang pemprosesannya sangat memakan masa. Setiap panggilan akan mengambil masa yang lama Kemudian kita perlu menyimpan nilai yang dikira Apabila memanggil fungsi ini, mula-mula cari dalam cache Jika ia tidak dijumpai, kemudian hitungkannya,

Kemudian kemas kini cache dan kembalikan nilai Jika dijumpai, kembalikan nilai yang ditemui secara langsung. Penutupan melakukan perkara ini kerana ia tidak mengeluarkan rujukan luaran,

Oleh itu nilai di dalam fungsi boleh dikekalkan.

Salin kod

Kod adalah seperti berikut:

var CachedSearchBox = (function(){
var cache = {},
Kira = [];
Kembali {
attachSearchBox: function(dsid){
                 jika (dsid dalam cache) {//Jika hasilnya ada dalam cache                                                                                                 Kembalikan cache [dsid]; // Kembali ke objek dalam cache terus
                                                                                  var fsb = uikit.webctrl.SearchBox(dsid);//Baharu  
              cache [dsid] = fsb;//Kemas kini cache                                                       Jika (count.length & gt; 100) {// Saiz cache & lt;                                                                                                                                                                                                                                   ...                                                                                      pulangkan fsb;                                                               },                                                       
Clearsearchbox: Fungsi (dsid) {
Jika(dsid dalam cache){
cache[dsid].clearSelection();                                                                                                                                                };  
})();
 
CachedSearchBox.attachSearchBox("input1");


Dengan cara ini, apabila kami memanggil CachedSearchBox.attachSerachBox("input1") untuk kali kedua,
Kami boleh mendapatkan semula objek daripada cache tanpa membuat objek kotak carian baharu.

3 Laksanakan enkapsulasi

Anda boleh melihat contoh enkapsulasi dahulu Pembolehubah dalaman tidak boleh diakses di luar orang itu, tetapi boleh diakses dengan menyediakan penutupan:

Salin kod

Kod adalah seperti berikut:

var orang = function(){ 

//Skop pembolehubah berada di dalam fungsi dan tidak boleh diakses dari luar

var name = "default"; var name

                            Kembali {           getName : function(){                                                    nama kembali;                                                      },                                                                setName : function(newName){                                               nama = nama baru;                                                                                                                             }   }();   print(person.name);//Akses langsung, hasilnya tidak ditentukan print(person.getName());

person.setName("abruzzi");

print(person.getName());



Hasilnya adalah seperti berikut:

tidak ditentukan
lalai
abruzzi

4 Satu lagi penggunaan penutup yang penting adalah untuk melaksanakan objek dalam bahasa objek tradisional menyediakan mekanisme templat kelas,
Dengan cara ini, objek yang berbeza (contoh kelas) mempunyai ahli dan keadaan bebas dan tidak mengganggu satu sama lain. Walaupun tiada mekanisme seperti kelas dalam JavaScript, dengan menggunakan penutupan,
Kita boleh mensimulasikan mekanisme sedemikian. Mari kita ambil contoh di atas:





Salin kod

Kod adalah seperti berikut:

Funktion Person(){ 
Var-Name = „Standard“; Var-Name
                           
Geben Sie {
zurück           getName : function(){                                                    Rückname;                                                     },                                                              setName : function(newName){                                               name = newName;                                                                                                                       }  
}; 
​  
​  
var john = Person();
print(john.getName());
john.setName("john");
print(john.getName());
​  
var jack = Person();
print(jack.getName());
jack.setName("jack");
print(jack.getName());



Die Laufergebnisse sind wie folgt:

Standard
John

Standard Jack

Aus diesem Code ist ersichtlich, dass sowohl John als auch Jack als Instanzen der Person-Klasse bezeichnet werden können, da der Zugriff der beiden Instanzen auf das Namensmitglied unabhängig ist und sich nicht gegenseitig beeinflusst.

Das Obige ist die Funktion des js-Abschlusses. Es ist sehr einfach und leicht zu verstehen. Ich hoffe, es wird meinen Freunden helfen