Perjalanan Reaksi Saya: Hari 9

Apa yang Saya Pelajari Hari Ini:

1. JavaScript tak segerak:

Definisi: Pengaturcaraan tak segerak membenarkan JavaScript melaksanakan tugas tanpa menunggu tugasan sebelumnya selesai.
Kes Penggunaan: Membuat panggilan API atau operasi lain yang memakan masa.
Faedah: Meningkatkan kecekapan dengan membolehkan tugasan lain dijalankan sementara menunggu respons.

1. Panggilan balik:

• Definisi: Panggilan balik ialah fungsi yang dihantar sebagai argumen kepada fungsi lain, dilaksanakan kemudian apabila diperlukan.
• Cabaran: Panggilan balik bersarang mencipta panggilan balik neraka, menjadikan kod sukar dibaca dan diselenggara.
• Penyelesaian: Janji telah diperkenalkan untuk memudahkan pengendalian tak segerak.

1. Janji:
2. Definisi: Janji mengendalikan operasi tak segerak dengan lebih bersih dan mengelakkan panggilan balik neraka.

• Negeri Janji:
  Belum selesai: Keadaan awal, menunggu keputusan.
  Selesai: Operasi berjaya.
  Ditolak: Operasi gagal.

• Kaedah:

.then(): Melaksanakan apabila janji telah diselesaikan.
.catch(): Melaksanakan apabila janji itu ditolak.
.finally(): Melaksanakan tanpa mengira sama ada janji itu diselesaikan atau ditolak.

Contoh janji

const fetchData = () => {
    return new Promise((resolve, reject) => {
        let success = true; // Simulating success or failure
        setTimeout(() => {
            success ? resolve("Data fetched!") : reject("Failed to fetch data.");
        }, 2000);
    });
};

fetchData()
    .then((data) => console.log(data)) // Output: Data fetched!
    .catch((error) => console.error(error))
    .finally(() => console.log("Operation completed."));

1. Async/Tunggu

• Tujuan: Dibina atas Janji untuk kod yang lebih bersih dan mudah dibaca.
• Fungsi Async: Mengisytiharkan fungsi yang akan mengendalikan operasi tak segerak.
• Tunggu Kata Kunci: Menjeda pelaksanaan fungsi sehingga janji diselesaikan atau ditolak.

Contoh Async/Await:

const fetchDataAsync = async () => {
    try {
        const data = await fetchData(); // Wait for the promise to resolve
        console.log(data);             // Output: Data fetched!
    } catch (error) {
        console.error(error);
    } finally {
        console.log("Operation completed.");
    }
};

fetchDataAsync();

5. Analogi Kehidupan Sebenar:

• Janji: Belum selesai: Pesan pizza dalam talian dan tunggu penghantaran. Selesai: Pizza tiba. Anda menikmati hidangan anda. Ditolak: Pizza tidak sampai. Awak mengeluh.
• Async/Await: Anda teruskan membaca buku sementara menunggu piza tiba.

6.Janji.semua

• Tujuan: Laksanakan berbilang janji serentak dan tunggu semua selesai. Contoh:

const promise1 = Promise.resolve("Task 1 completed");
const promise2 = Promise.resolve("Task 2 completed");

Promise.all([promise1, promise2])
    .then((results) => console.log(results)) // Output: ["Task 1 completed", "Task 2 completed"]
    .catch((error) => console.error(error));

1. Async/Tunggu dengan API Ambil

• Ambil: Cara moden untuk membuat permintaan HTTP dalam JavaScript. Contoh:

const fetchDataFromAPI = async () => {
    try {
        const response = await fetch("https://jsonplaceholder.typicode.com/posts");
        const data = await response.json();
        console.log(data);
    } catch (error) {
        console.error("Error fetching data:", error);
    }
};

fetchDataFromAPI();

Sorotan

• Janji membersihkan operasi tak segerak dan meningkatkan pengendalian ralat.
• Async/Await menjadikan kod lebih mudah untuk ditulis dan difahami, terutamanya untuk Janji berantai.
• Promise.all berguna untuk menjalankan berbilang tugas tak segerak secara selari.

Setakat ini ia adalah perjalanan yang indah.

Hari 10 dengan api

Atas ialah kandungan terperinci Perjalanan Reaksi Saya: Hari 9. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!