Definisi fungsi panggilan balik
Fungsi panggilan balik adalah fungsi yang dipanggil melalui penunjuk fungsi. Jika Anda melewati pointer (alamat) fungsi sebagai argumen ke fungsi lain, ketika pointer ini digunakan untuk memanggil fungsi yang ditunjukkannya, kami katakan ini adalah fungsi callback. Fungsi callback tidak dipanggil langsung oleh pelaksana fungsi, tetapi dipanggil oleh pihak lain ketika peristiwa atau kondisi tertentu terjadi, dan digunakan untuk menanggapi peristiwa atau kondisi tersebut.
Dalam JavaScript, definisi spesifik dari fungsi callback adalah: Fungsi A dilewatkan sebagai parameter (referensi fungsi) ke fungsi lain B, dan fungsi ini B Execute Function A. Katakanlah bahwa fungsi A disebut fungsi callback. Jika tidak ada nama (ekspresi fungsi), itu disebut fungsi panggilan balik anonim. Oleh karena itu, panggilan balik tidak harus digunakan untuk asinkron. Callback sering digunakan dalam skenario sinkron (pemblokiran) umum, seperti yang mengharuskan beberapa operasi dieksekusi dan fungsi callback dieksekusi.
contoh
Contoh menggunakan panggilan balik dalam sinkronisasi (pemblokiran) adalah untuk mengeksekusi Func2 setelah kode Func1 dijalankan.
Salinan kode adalah sebagai berikut:
var func1 = function (callback) {
// Lakukan sesuatu.
(callback && typeof (callback) === "function") && callback ();
}
func1 (func2);
var func2 = function () {
}
Gunakan kasus fungsi panggilan balik
Pemuatan Sumber Daya: Jalankan panggilan balik setelah pemuatan dinamis file JS, jalankan panggilan balik setelah memuat iframe, jalankan panggilan balik setelah memuat panggilan balik operasi AJAX, jalankan panggilan balik setelah pemuatan gambar, Ajax, dll.
Acara DOM dan acara Node.js didasarkan pada mekanisme panggilan balik (node.js callback mungkin memiliki masalah sarang panggilan balik multi-lapisan).
Waktu tunda setTimeout adalah 0. Peretasan ini sering digunakan. Fungsi yang dipanggil oleh SetTimeout sebenarnya adalah perwujudan panggilan balik
Panggilan rantai: Saat panggilan rantai, mudah untuk menerapkan panggilan rantai dalam metode evaluator (setter) (atau dalam metode yang tidak mengembalikan nilai), tetapi nilai pengambil relatif sulit untuk menerapkan panggilan rantai, karena Anda memerlukan nilai pengambil untuk mengembalikan data yang Anda butuhkan alih -alih penunjuk ini. Jika Anda ingin menerapkan metode rantai, Anda dapat menggunakan fungsi panggilan balik untuk mengimplementasikannya.
Fungsi panggilan setTimeout dan setInterval dapatkan nilai pengembalian mereka. Karena kedua fungsi itu tidak sinkron, yaitu, waktu panggilan mereka dan proses utama program ini relatif independen, tidak ada cara untuk menunggu nilai pengembalian mereka di dalam tubuh, dan program tidak akan berhenti dan menunggu ketika mereka dibuka, jika tidak, makna SetTimeout dan SetInterval akan hilang. Oleh karena itu, tidak ada artinya untuk menggunakan pengembalian, jadi panggilan balik hanya dapat digunakan. Arti callback adalah untuk memberi tahu fungsi proxy dari hasil eksekusi timer untuk pemrosesan tepat waktu.
Fungsi adalah objek
Jika Anda ingin memahami fungsi panggilan balik, Anda harus terlebih dahulu memahami aturan fungsi. Dalam JavaScript, fungsi aneh, tetapi mereka memang objek. Lebih tepatnya, suatu fungsi adalah objek fungsi yang dibuat dengan konstruktor fungsi (). Objek fungsi berisi string yang berisi kode JavaScript fungsi. Jika Anda ditransfer dari C atau Java, ini mungkin tampak aneh, bagaimana kode bisa menjadi string? Tapi untuk JavaScript, ini cukup umum. Perbedaan antara data dan kode tidak jelas.
Salinan kode adalah sebagai berikut:
// fungsi dapat dibuat dengan cara ini
var fn = fungsi baru ("arg1", "arg2", "return arg1 * arg2;");
fn (2, 3); // 6
Salah satu keuntungan dari ini adalah Anda dapat meneruskan kode ke fungsi lain, atau Anda dapat melewati variabel atau objek reguler (karena kode secara harfiah hanya suatu objek).
Fungsi transfer sebagai panggilan balik
Mudah untuk melewati fungsi sebagai parameter.
Salinan kode adalah sebagai berikut:
fungsi fn (arg1, arg2, callback) {
var num = math.ceil (math.random () * (arg1 - arg2) + arg2);
Callback (num); // Lewati hasilnya
}
fn (10, 20, fungsi (num) {
console.log ("Callback Called! Num:" + num);
}); // Hasilnya adalah angka acak antara 10 dan 20
Mungkin melakukan ini tampaknya rumit dan bahkan sedikit bodoh, mengapa tidak mengembalikan hasilnya secara tidak normal? Tetapi ketika Anda harus menggunakan fungsi panggilan balik, Anda mungkin tidak berpikir begitu!
Jangan menghalangi
Fungsi tradisional memasukkan data sebagai parameter dan menggunakan pernyataan pengembalian untuk mengembalikan nilai. Secara teori, ada pernyataan pengembalian kembali di akhir fungsi, yang terstruktur: titik input dan titik output. Ini lebih mudah dimengerti. Fungsi pada dasarnya memetakan proses implementasi antara input dan output.
Namun, ketika proses implementasi fungsi sangat panjang, haruskah Anda memilih untuk menunggu fungsi untuk menyelesaikan pemrosesan, atau menggunakan fungsi callback untuk melakukan pemrosesan yang tidak sinkron? Dalam hal ini, menggunakan fungsi callback menjadi kritis, seperti: permintaan AJAX. Jika Anda menggunakan fungsi panggilan balik untuk diproses, kode dapat terus melakukan tugas lain tanpa mengosongkannya. Dalam pengembangan yang sebenarnya, panggilan asinkron sering digunakan dalam JavaScript, dan bahkan sangat direkomendasikan di sini!
Di bawah ini adalah contoh yang lebih komprehensif dari memuat file XML menggunakan AJAX, dan menggunakan fungsi Call () untuk memanggil fungsi callback dalam konteks objek yang diminta.
Salinan kode adalah sebagai berikut:
fungsi fn (url, callback) {
var httprequest; // Buat xhr
httpRequest = window.xmlHttpRequest? xmlhttpRequest baru ():
window.activexObject? ActivexObject baru ("Microsoft.xmlhttp"): tidak terdefinisi; // Deteksi fungsional untuk IE
httprequest.onreadystatechange = function () {
if (httpRequest.readystate === 4
&& httpRequest.status === 200) {// Status Judgment
callback.call (httprequest.responsexml);
}
};
httprequest.open ("get", url);
httpRequest.send ();
}
fn ("text.xml", function () {// Memanggil fungsi
Console.log (ini); // output setelah pernyataan ini
});
console.log ("Ini akan berjalan sebelum panggilan balik di atas."); // Pernyataan ini adalah output terlebih dahulu
Permintaan kami untuk pemrosesan asinkron berarti bahwa ketika kami mulai meminta, kami memberi tahu mereka untuk memanggil fungsi kami setelah selesai. Dalam situasi yang sebenarnya, pawang acara OnReadyStateChange juga harus mempertimbangkan kegagalan permintaan. Di sini kami berasumsi bahwa file XML ada dan dapat dimuat dengan sukses oleh browser. Dalam contoh ini, fungsi asinkron ditetapkan untuk acara OnReadyStateChange dan karenanya tidak akan segera dieksekusi.
Akhirnya, pernyataan Console.log kedua dieksekusi terlebih dahulu, karena fungsi panggilan balik tidak dijalankan sampai permintaan selesai.
Contoh di atas tidak mudah dimengerti, jadi lihatlah contoh berikut:
Salinan kode adalah sebagai berikut:
fungsi foo () {
var a = 10;
return function () {
a *= 2;
mengembalikan a;
};
}
var f = foo ();
F(); // Kembalikan 20.
F(); // Kembalikan 40.
Fungsi ini disebut secara eksternal dan masih dapat mengakses variabel a. Ini semua karena ruang lingkup dalam JavaScript adalah leksikal. Berjalan fungsional dalam ruang lingkup yang mendefinisikannya (ruang lingkup di dalam foo pada contoh di atas), bukan dalam ruang lingkup di mana fungsi ini dijalankan. Selama F didefinisikan dalam FOO, dapat mengakses semua variabel yang didefinisikan dalam FOO, bahkan jika eksekusi FOO telah berakhir. Karena ruang lingkupnya akan disimpan, tetapi hanya fungsi yang dikembalikan yang dapat mengakses ruang lingkup yang disimpan. Mengembalikan fungsi anonim tertanam adalah metode yang paling umum untuk membuat penutupan.