Memahami Fungsi Panggilan Balik dalam JavaScript: Panduan Komprehensif

Fungsi Panggilan Balik dalam JavaScript

Satu fungsi panggil balik ialah fungsi yang dihantar sebagai hujah kepada fungsi lain. Ia membenarkan fungsi memanggil fungsi lain, membolehkan operasi tak segerak dan reka bentuk kod modular.

---

1. Memahami Fungsi Panggilan Balik

Takrif

Panggil balik ialah fungsi yang dihantar sebagai hujah kepada fungsi lain dan dilaksanakan selepas beberapa operasi selesai.

Contoh Asas

function greet(name, callback) {
  console.log("Hello, " + name);
  callback();
}

function sayGoodbye() {
  console.log("Goodbye!");
}

greet("Alice", sayGoodbye);
// Output:
// Hello, Alice
// Goodbye!

Dalam contoh ini, sayGoodbye ialah fungsi panggil balik yang dihantar untuk memberi salam.

---

2. Panggilan Balik Segerak

Panggil balik segerak dilaksanakan serta-merta dalam fungsi.

Contoh: Lelaran Tatasusunan

const numbers = [1, 2, 3, 4];

numbers.forEach(function(number) {
  console.log(number * 2);
});
// Output:
// 2
// 4
// 6
// 8

Di sini, fungsi panggil balik di dalam forEach dilaksanakan untuk setiap elemen tatasusunan.

---

3. Panggilan Balik Tak Segerak

Panggil balik tak segerak digunakan untuk tugas seperti mengambil data, pemasa atau mengendalikan acara. Mereka laksanakan selepas operasi semasa selesai.

Contoh: Pemasa

console.log("Start");

setTimeout(function() {
  console.log("This runs after 2 seconds");
}, 2000);

console.log("End");
// Output:
// Start
// End
// This runs after 2 seconds

---

4. Fungsi Panggilan Balik Tersuai

Anda boleh mencipta fungsi tersuai yang menerima panggilan balik.

Contoh: Lakukan Operasi

function performOperation(a, b, callback) {
  const result = a + b;
  callback(result);
}

performOperation(5, 3, function(result) {
  console.log("The result is:", result);
});
// Output:
// The result is: 8

---

5. Mengendalikan Ralat dengan Panggilan Balik

Apabila menggunakan panggilan balik, anda boleh menghantar ralat kepada fungsi panggil balik untuk mengendalikannya dengan anggun.

Contoh: Mensimulasikan Ralat

function fetchData(callback) {
  const error = false;
  const data = { id: 1, name: "Alice" };

  if (error) {
    callback("Error occurred", null);
  } else {
    callback(null, data);
  }
}

fetchData(function(err, data) {
  if (err) {
    console.log(err);
  } else {
    console.log("Data fetched:", data);
  }
});
// Output:
// Data fetched: { id: 1, name: 'Alice' }

---

6. Kes Penggunaan Biasa Panggilan Balik

1. Pengendalian Acara:

document.querySelector("button").addEventListener("click", function() {
  console.log("Button clicked!");
});

1. Pemasa:

setTimeout(function() {
  console.log("This runs after 1 second");
}, 1000);

1. Panggilan API: Panggilan balik digunakan secara meluas dalam permintaan AJAX tradisional dan API gaya lama.

---

7. Panggilan Balik vs Janji

Walaupun panggilan balik berguna, ia boleh membawa kepada neraka panggilan balik apabila bersarang terlalu dalam.

Contoh Neraka Panggilan Balik:

getData(function(data) {
  processData(data, function(result) {
    saveData(result, function(response) {
      console.log("Data saved:", response);
    });
  });
});

JavaScript moden menggunakan Janji atau tidak segerak/menunggu untuk mengendalikan operasi tak segerak dengan lebih bersih.

---

8. Kelebihan Fungsi Panggilan Balik

• Dayakan pengaturcaraan tak segerak.
• Promosikan kod modular dan boleh guna semula.
• Memudahkan tingkah laku tersuai.

9. Kelemahan Fungsi Panggilan Balik

• Boleh mengakibatkan panggilan balik neraka (panggilan balik bersarang dalam).
• Sukar dibaca dan nyahpepijat dalam senario yang rumit.

---

10. Ringkasan

• Panggil balik ialah fungsi yang dihantar sebagai hujah kepada fungsi lain.
• Ia penting untuk pengaturcaraan tak segerak dalam JavaScript.
• Sentiasa mengendalikan ralat dengan betul apabila menggunakan panggilan balik.
• Pertimbangkan untuk menggunakan Promises atau async/menunggu kod yang lebih bersih dan boleh diselenggara.

Memahami panggilan balik ialah langkah asas dalam menguasai pengaturcaraan JavaScript.

Hai, saya Abhay Singh Kathayat!
Saya seorang pembangun tindanan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.
Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.

Atas ialah kandungan terperinci Memahami Fungsi Panggilan Balik dalam JavaScript: Panduan Komprehensif. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!