Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang penutupan dalam pengetahuan Javascript_Basic

Penjelasan terperinci tentang penutupan dalam pengetahuan Javascript_Basic

WBOY
Lepaskan: 2016-05-16 16:24:21
asal
941 orang telah melayarinya

Kata Pengantar: Ini masih merupakan artikel pengenalan. Terdapat beberapa ciri bahasa yang sangat penting dalam Javascript - objek, warisan prototaip dan penutupan. Antaranya, penutupan ialah ciri bahasa baharu untuk pengaturcara yang menggunakan bahasa statik tradisional C/C. Artikel ini akan bermula dengan contoh untuk memperkenalkan ciri bahasa penutupan Javascript dan menggabungkannya dengan beberapa spesifikasi bahasa ECMAScript untuk membolehkan pembaca memahami lebih mendalam tentang penutupan.

Nota: Artikel ini adalah artikel pengenalan Bahan contoh disusun dari Internet Jika anda seorang pakar, anda dialu-alukan untuk memberikan cadangan dan pendapat teknikal mengenai artikel tersebut. Artikel ini membincangkan Javascript. Saya tidak mahu membuat perbandingan bahasa Jika anda sememangnya tidak selesa dengan Javascript, sila ambil lencongan.

Apakah itu penutupan
Apakah penutupan? Penutupan ialah Penutupan, iaitu ciri baharu yang tidak ada pada bahasa statik. Tetapi penutupan bukanlah sesuatu yang terlalu rumit untuk difahami Secara ringkasnya, penutupan ialah:

Penutupan ialah koleksi pembolehubah tempatan sesuatu fungsi, tetapi pembolehubah tempatan ini akan terus wujud selepas fungsi itu kembali.
Penutupan bermaksud bahawa "timbunan" fungsi tidak dikeluarkan selepas fungsi itu kembali. Kita juga boleh memahami bahawa timbunan fungsi ini tidak diperuntukkan pada timbunan tetapi pada timbunan
Apabila mentakrifkan fungsi lain dalam fungsi, penutupan akan dijana
Takrifan kedua di atas ialah penjelasan tambahan pertama, mengekstrak subjek, predikat dan objek definisi pertama - penutupan ialah set 'pembolehubah tempatan' fungsi. Cuma pembolehubah tempatan ini boleh diakses selepas fungsi kembali. (Ini bukan definisi rasmi, tetapi definisi ini sepatutnya lebih membantu anda memahami penutupan)

Sebagai pembolehubah tempatan, ia boleh diakses oleh kod dalam fungsi Ini tidak berbeza dengan bahasa statik. Perbezaan dengan penutupan ialah pembolehubah tempatan masih boleh diakses oleh kod di luar fungsi selepas pelaksanaan fungsi tamat. Ini bermakna fungsi mesti mengembalikan "rujukan" yang menunjuk kepada penutupan, atau memberikan "rujukan" ini kepada pembolehubah luaran untuk memastikan pembolehubah tempatan dalam penutupan boleh diakses oleh kod luaran. Sudah tentu, entiti yang mengandungi rujukan ini harus menjadi objek, kerana dalam Javascript, kecuali untuk jenis asas, semua yang lain adalah objek. Malangnya, ECMAScript tidak menyediakan ahli dan kaedah yang berkaitan untuk mengakses pembolehubah tempatan dalam penutupan. Tetapi dalam ECMAScript, fungsi dalaman (fungsi dalaman) yang ditakrifkan dalam objek fungsi boleh terus mengakses pembolehubah tempatan fungsi luaran Melalui mekanisme ini, kita boleh melengkapkan akses kepada penutupan dengan cara berikut.

Salin kod Kod adalah seperti berikut:

ucapan fungsi(nama) {
var text = 'Hello ' name; // pembolehubah tempatan
// Setiap kali ia dipanggil, penutupan dijana dan objek fungsi dalaman dikembalikan kepada pemanggil
Kembalikan fungsi() { makluman(teks); }
var sayHello=greeting("Penutupan");
sayHello() // Teks pembolehubah tempatan
diakses melalui penutupan

Hasil pelaksanaan kod di atas ialah: Hello Closure, kerana fungsi sayHello() masih boleh mengakses teks pembolehubah tempatan yang ditakrifkan di dalamnya selepas fungsi sapaan dilaksanakan.

Baiklah, ini adalah kesan legenda penutupan yang mempunyai pelbagai senario dan mod aplikasi dalam Javascript, seperti Singleton, Power Constructor dan mod Javascript lain yang tidak dapat dipisahkan daripada penggunaan penutupan.

Model Penutupan ECMAScript
Bagaimanakah ECMAScript melaksanakan penutupan? Mereka yang ingin mengetahui lebih lanjut boleh mendapatkan spesifikasi ECMAScript untuk penyelidikan Saya hanya akan memberikan penjelasan ringkas di sini, dan kandungannya juga datang dari Internet.

Apabila fungsi skrip ECMAscript sedang berjalan, setiap perkaitan fungsi mempunyai adegan konteks pelaksanaan (Konteks Pelaksanaan ini mengandungi tiga bahagian

).

Persekitaran Leksikal
The VariableEnvironment
pengikat ini
Perkara ketiga, pengikatan ini, tiada kaitan dengan penutupan dan tidak akan dibincangkan dalam artikel ini. Persekitaran tatabahasa digunakan untuk menghuraikan pengecam pembolehubah yang digunakan semasa pelaksanaan fungsi. Kita boleh membayangkan persekitaran tatabahasa sebagai objek, yang mengandungi dua komponen penting, rekod persekitaran (Enviroment Recode), dan rujukan luaran (pointer). Rekod persekitaran mengandungi pembolehubah tempatan dan pembolehubah parameter yang diisytiharkan di dalam fungsi, dan rujukan luaran menunjuk kepada senario pelaksanaan konteks objek fungsi luaran. Nilai rujukan ini dalam adegan konteks global ialah NULL. Struktur data sedemikian membentuk senarai terpaut sehala, dengan setiap rujukan menunjuk ke adegan konteks luar.

Sebagai contoh, model penutupan contoh kami di atas sepatutnya seperti ini Fungsi sayHello berada di lapisan bawah, lapisan atas ialah fungsi ucapan, dan lapisan paling luar ialah pemandangan global. Seperti yang ditunjukkan di bawah: Jadi apabila sayHello dipanggil, sayHello akan mencari nilai teks pembolehubah tempatan melalui adegan konteks, jadi "Hello Closure" dipaparkan dalam kotak dialog pada skrin Fungsi persekitaran berubah (The VariableEnvironment) dan persekitaran tatabahasa pada dasarnya serupa. Sila rujuk kepada dokumen spesifikasi ECMAScript untuk perbezaan tertentu.

Contoh turutan penutupan
Sebelum ini, saya secara kasarnya memahami apakah penutupan Javascript dan cara penutupan dilaksanakan dalam Javascript. Di bawah kami akan membantu anda memahami penutupan dengan lebih mendalam melalui beberapa contoh. Terdapat 5 contoh di bawah. Contoh 1: Pembolehubah setempat dalam penutupan ialah rujukan dan bukannya salinan

Salin kod Kod adalah seperti berikut:

fungsi say667() {
// Pembolehubah setempat yang berakhir dalam penutupan
var num = 666;
var sayAlert = function() { alert(num); nombor ;
Kembali sayAlert;
}

var sayAlert = say667();
sayAlert()

Jadi hasil pelaksanaan hendaklah 667 bukannya 666.

Contoh 2: Berbilang fungsi mengikat penutupan yang sama kerana ia ditakrifkan dalam fungsi yang sama.

Salin kod Kod adalah seperti berikut:
function setupSomeGlobals() {
// Pembolehubah setempat yang berakhir dalam penutupan
var num = 666;
// Simpan beberapa rujukan kepada fungsi sebagai pembolehubah global
gAlertNumber = function() { alert(num); gIncreaseNumber = function() { num ; gSetNumber = function(x) { num = x; }
setupSomeGlobals(); // Berikan nilai kepada tiga pembolehubah global
gAlertNumber(); //666
gIncreaseNumber();
gAlertNumber(); // 667
gSetNumber(12);//
gAlertNumber();//12



Contoh 3: Apabila menetapkan fungsi dalam gelung, fungsi ini akan terikat pada penutupan yang sama

Salin kod

Kod adalah seperti berikut: function buildList(senarai) { hasil var = [];
untuk (var i = 0; i < list.length; i ) {
        var item = senarai 'item'[i];
result.push( function() {alert(item ' ' list[i])} );
}
Pulangan hasil;
}
function testList() {
var fnlist = buildList([1,2,3]);
// menggunakan j sahaja untuk membantu mengelakkan kekeliruan - boleh menggunakan i
untuk (var j = 0; j < fnlist.length; j ) {
            senarai f[j]();
}
}

Hasil pelaksanaan testList ialah tetingkap item3 undefined muncul tiga kali, kerana ketiga-tiga fungsi ini terikat pada penutupan yang sama, dan nilai item ialah hasil pengiraan terakhir, tetapi apabila saya melompat keluar dari gelung, nilai i ialah 4, jadi senaraikan Keputusan [4] tidak ditentukan.

Contoh 4: Semua pembolehubah tempatan bagi fungsi luar berada dalam penutupan, walaupun pembolehubah ini diisytiharkan selepas fungsi dalam ditakrifkan.

Salin kod Kod adalah seperti berikut:

fungsi sayAlice() {
var sayAlert = function() { alert(alice); // Pembolehubah setempat yang berakhir dalam penutupan
var alice = 'Hello Alice';
Kembali sayAlert;
}
var helloAlice=sayAlice();
helloAlice();

Hasil pelaksanaan ialah tetingkap timbul "Hello Alice". Walaupun pembolehubah tempatan diisytiharkan selepas fungsi sayAlert, pembolehubah tempatan masih boleh diakses.

Contoh 5: Buat penutupan baharu setiap kali fungsi dipanggil

Salin kod Kod adalah seperti berikut:
fungsi newClosure(someNum, someRef) {
// Pembolehubah setempat yang berakhir dalam penutupan
var num = someNum;
var anArray = [1,2,3];
var ref = someRef;
Kembalikan fungsi(x) {
         bilangan = x;
        anArray.push(num);
makluman('bilangan: ' nombor
          'nanArray ' anArray.toString()
          'nref.someVar ' ref.someVar);
}
}
closure1=newClosure(40,{someVar:'closure 1'});
closure2=newClosure(1000,{someVar:'closure 2'});

closure1(5); // num:45 anArray[1,2,3,45] ref:'someVar closure1'
closure2(-10);// num:990 anArray[1,2,3,990] ruj:'someVar closure2'

Permohonan penutupan

Singleton:

Salin kod Kod adalah seperti berikut:
var singleton = fungsi () {
var privateVariable;
function privateFunction(x) {
           ...pembolehubah peribadi...
}

Kembali {
         pertamaKaedah: fungsi (a, b) {
                  ...pembolehubah peribadi...
},
secondMethod: fungsi (c) {
                  ... privateFunction()...
}
};
}();

Singleton ini dilaksanakan melalui penutupan. Enkapsulasi ahli persendirian dan kaedah diselesaikan melalui penutupan. Fungsi utama tanpa nama mengembalikan objek. Objek mengandungi dua kaedah, kaedah 1 boleh mengakses pembolehubah persendirian, dan kaedah 2 boleh mengakses fungsi persendirian dalaman. Apa yang perlu diberi perhatian ialah '()' di hujung fungsi utama tanpa nama Tanpa '()' ini, singleton tidak boleh dijana. Kerana fungsi tanpa nama hanya boleh mengembalikan objek unik dan tidak boleh dipanggil dari tempat lain. Ini adalah cara menggunakan penutupan untuk menjana singleton.


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan