Jenis Janji dalam JavaScript

Maafkan saya atas Kesilapan Taip dan Tatabahasa, saya masih belajar. ?

Apa itu Janji?

Janji ialah cara untuk mengendalikan operasi tak segerak dalam JavaScript. Mereka mewakili nilai yang mungkin tersedia sekarang, atau pada masa hadapan, atau tidak pernah. Janji mempunyai tiga keadaan: belum selesai, dipenuhi dan ditolak.

Jenis Janji

1. Belum selesai: Keadaan awal janji. Ini menunjukkan bahawa operasi masih berjalan dan belum selesai.

2. Ditepati: Keadaan janji apabila operasi telah berjaya diselesaikan. Janji itu mempunyai nilai, dan ia tersedia untuk digunakan.

3. Ditolak: Keadaan janji apabila operasi telah gagal. Janji mempunyai sebab untuk kegagalan, dan ia boleh dikendalikan menggunakan kaedah tangkapan.

Mengapa Janji Penting?

• Janji membantu dalam menulis kod tak segerak yang lebih bersih dan mudah dibaca.
• Mereka menyediakan cara untuk mengendalikan operasi tak segerak dengan cara yang lebih berstruktur.
• Janji boleh dirantai bersama untuk melaksanakan berbilang operasi tak segerak secara berurutan.
• Sama ada mengambil data, mengendalikan pelbagai tugas atau berlumba untuk mendapatkan hasil yang pantas, Janji adalah penting dalam JavaScript Moden.

1. Janji Mudah

const promise = new Promise((resolve, reject) => {
    // Imagine fetching user data from an API
    const user = {
        name: "Aasim Ashraf",
        age: 21,
    };

    user ? resolve(user) : reject("User not found");
});

promise
    .then((user) => console.log(user))
    .catch((error) => console.log(error));

Janji yang sama ada menyelesaikan atau menolak yang sering digunakan untuk panggilan API atau tugas async.

• Bila Perlu Digunakan : Untuk operasi tak segerak tunggal seperti mengambil data daripada API.
• Kelebihan : Pengendalian kejayaan dan kegagalan yang bersih dalam satu blok.

2. Janji.semua Operasi Pelbagai

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

Menunggu semua janji untuk diselesaikan, jika salah satu gagal, seluruh rantai gagal. Terbaik untuk berbilang tugas async yang perlu diselesaikan bersama.

• Bila Perlu Digunakan : Untuk berbilang operasi async yang tidak bergantung antara satu sama lain.
• Kelebihan : Ambil berbilang data serentak dan kendalikannya bersama-sama.
• Kelemahan : Jika seorang gagal, semua gagal.

Apa Berlaku jika Satu Janji Gagal dalam Janji.semua?

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

Masalah dengan Janji.semuanya adalah jika satu janji gagal, seluruh rantai gagal. Untuk mengelakkan perkara ini, anda boleh menggunakan Promise.allSettled.

3. Janji.semua Selesai

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.allSettled([fetchUser, fetchPosts])
    .then((results) => {
        results.forEach((result) => {
            if (result.status === "fulfilled") {
                console.log("User Data:", result.value);
            } else {
                console.log("Error:", result.reason);
            }
        });
    });

Promise.allSettled menunggu semua janji untuk diselesaikan, sama ada ia diselesaikan atau ditolak. Ia mengembalikan tatasusunan objek dengan status dan nilai atau sebab.

• Bila Penggunaan : Apabila anda ingin mengetahui semua keputusan, malah kegagalan.
• Kelebihan : Ambil berbilang data serentak dan kendalikannya bersama-sama.
• Kelemahan : Jika gagal, ia tidak akan menghentikan rantai

4. Janji.perlumbaan Keputusan Terpantas

const fast = new Promise(resolve => setTimeout(resolve, 1000, "Fast"));

const slow = new Promise(resolve => setTimeout(resolve, 2000, "Slow"));

Promise.race([fast, slow])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log(error));

Mengembalikan hasil janji pertama untuk diselesaikan, sama ada diselesaikan atau ditolak. Berguna apabila anda memerlukan kelajuan, seperti memuatkan respons pertama yang tersedia.

• Bila Penggunaan : Apabila kelajuan lebih penting daripada menunggu semua keputusan.
• Had : Anda mungkin mendapat ralat jika janji terpantas gagal.

Bagaimana jika Janji dalam Promise.race Gagal?

const error = new Promise((resolve) => {
    setTimeout(() => resolve("Error"), 1000);
});

const success = new Promise((resolve) => {
    setTimeout(() => resolve("Success"), 2000);
});

Promise.race([error, success])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log("First Rejected",error));

Jika janji pertama gagal, seluruh rantai gagal. Untuk mengelakkan perkara ini, anda boleh menggunakan Promise.any.

5. Janji.sebarang Keputusan Berjaya Pertama

const promise1 = Promise.reject("Error 1");
const promise2 = new Promise(resolve => setTimeout(resolve, 3000, "Promise 2"));

Promise.any([promise1, promise2])
    .then((result) => {
        console.log("First Success",result);
    })
    .catch((error) => console.log("All Rejected",error));

Menyelesaikan apabila mana-mana satu Janji diselesaikan. Abaikan semua penolakan sehingga semua janji ditolak. Berguna apabila anda memerlukan hasil pertama yang berjaya, tanpa mengira yang lain.

• Bila Penggunaan : Apabila anda memerlukan hasil pertama yang berjaya, tanpa mengira janji-janji yang lain.
• Had : Jika semua janji ditolak, ia akan menimbulkan ralat.

Rekap

• Janji Mudah: Untuk operasi async tunggal seperti mengambil data daripada API.
• Promise.all: Untuk berbilang operasi async yang tidak bergantung antara satu sama lain.
• Promise.allSettled: Apabila anda ingin mengetahui semua keputusan, malah kegagalan.
• Janji.perlumbaan: Apabila kelajuan lebih penting daripada menunggu semua keputusan.
• Promise.any: Apabila anda memerlukan hasil pertama yang berjaya, tanpa mengira janji yang lain.

Fikiran Akhir

• Memilih jenis janji yang betul adalah kunci kepada pengaturcaraan tak segerak yang cekap.
• Gunakan Janji yang paling sesuai dengan kes penggunaan anda: Kelajuan, berbilang operasi atau pengendalian semua hasil.

Atas ialah kandungan terperinci Jenis Janji dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!