Articles
Panimula sa TypeScript
Promise Class sa TypeScript

Promise Class sa TypeScript

Ipinaliwanag ng artikulong ito ang Promise class sa TypeScript.

YouTube Video

Promise

Ang Promise class sa TypeScript ay halos katulad ng Promise sa JavaScript. Ang Promise ay isang built-in na klase para sa paghawak ng mga asynchronous na operasyon, na kumakatawan sa resulta ng isang asynchronous na operasyon kapag natapos na ito. Dito, ipapaliwanag namin ang pangunahing paggamit ng Promises at mga kaugnay na konsepto.

Pangunahing Paggamit

Paglikha ng Promise:

Ang isang Promise object ay ginagamit upang balutin ang mga asynchronous na operasyon. Ang isang Promise ay nilikha gamit ang new Promise(executor), at ito ay nagsasagawa ng mga asynchronous na operasyon sa loob nito. Ang executor ay tumatanggap ng dalawang function, ang resolve at reject, bilang mga argumento.

1const myPromise = new Promise<number>((resolve, reject) => {
2    // Perform asynchronous operations
3    const success = true; // This is just an example
4    if (success) {
5        resolve(42); // In case of success
6    } else {
7        reject('Failed'); // In case of failure
8    }
9});

Paggamit ng Promise:

Ang nilikhang Promise ay pinoproseso gamit ang then() at catch().

1myPromise.then((value) => {
2    console.log(`Success: ${value}`); // Process the value passed with resolve
3}).catch((error) => {
4    console.error(`Error: ${error}`); // Handle the error passed with reject
5});

finally() na pamamaraan 

 1const myPromise = new Promise<number>((resolve, reject) => {
 2    // Perform asynchronous operations
 3    const success = false; // This is just an example
 4    if (success) {
 5        resolve(42); // In case of success
 6    } else {
 7        reject('Failed'); // In case of failure
 8    }
 9});
10
11myPromise.then((value) => {
12    console.log(`Success: ${value}`); // Process the value passed with resolve
13}).catch((error) => {
14    console.error(`Error: ${error}`); // Handle the error passed with reject
15}).finally(() => {
16    console.log('The operation has completed');
17});
  • Ang finally() na pamamaraan ay nagtatakda ng code na palaging isasagawa kahit na ang Promise ay natupad o tinanggihan.

Pagkonekta ng Mga Promises:

Sa pamamagitan ng pagkonekta ng then() pagkatapos ng then(), pwede mong pag-ugnayin ang maraming asynchronous na mga operasyon ng sunud-sunod.

 1const myPromise = new Promise<number>((resolve, reject) => {
 2    // Perform asynchronous operations
 3    const success = true; // This is just an example
 4    if (success) {
 5        resolve(42); // In case of success
 6    } else {
 7        reject('Failed'); // In case of failure
 8    }
 9});
10
11myPromise
12    .then((value) => {
13        console.log(`Success: ${value}`);
14        return value + 1; // Pass the value to the next then
15    })
16    .then((newValue) => {
17        console.log(`New value: ${newValue}`);
18    })
19    .catch((error) => {
20        console.error(`Error: ${error}`);
21    });

async/await:

Sa TypeScript, maaari mong hawakan ang Promises nang mas direkta gamit ang async/await. Sa loob ng isang async function, maaari mong gamitin ang keyword na await upang hintayin ang resulta ng isang Promise.

 1const myPromise = new Promise<number>((resolve, reject) => {
 2    // Perform asynchronous operations
 3    const success = true; // This is just an example
 4    if (success) {
 5        resolve(42); // In case of success
 6    } else {
 7        reject('Failed'); // In case of failure
 8    }
 9});
10
11async function asyncFunction() {
12    try {
13        const value = await myPromise;
14        console.log(`Success: ${value}`);
15    } catch (error) {
16        console.error(`Error: ${error}`);
17    }
18}
19
20asyncFunction();

Mga Metodo ng Promise

Promise.all()

Nagpapatupad ang Promise.all ng maraming Promises nang sabay-sabay at naghihintay hanggang lahat ay matupad.

 1const promise1 = Promise.resolve(1);
 2const promise2 = Promise.resolve(2);
 3const promise3 = Promise.resolve(3);
 4
 5Promise.all([promise1, promise2, promise3])
 6    .then((results) => {
 7        console.log(results);  // [1, 2, 3]
 8    })
 9    .catch((error) => {
10        console.error('Error :', error);
11    });
  • Ang then() ay tinatawag lamang kapag lahat ng Promises ay natupad. Ang catch() ay tinatawag kapag may kahit isang nabigong Promise.

Promise.race()

Ang Promise.race ay nagbabalik ng resulta ng unang Promise na natapos sa maraming Promises.

1const promise1 = new Promise((resolve) => setTimeout(resolve, 100, 'First'));
2const promise2 = new Promise((resolve) => setTimeout(resolve, 500, 'Second'));
3
4Promise.race([promise1, promise2]).then((result) => {
5    console.log(result);  // "First"
6});
  • Gaya ng halimbawa na ito, ang resulta ng unang Promise na natapos ay ibinabalik.

Promise.allSettled()

Ang Promise.allSettled ay naghihintay na matapos lahat ang mga Promises at nagbabalik ng isang array ng lahat ng resulta, kabilang ang mga natupad at tinanggihan.

 1const promise1 = Promise.resolve(1);
 2const promise2 = Promise.reject("Failed");
 3const promise3 = Promise.resolve(3);
 4
 5Promise.allSettled([promise1, promise2, promise3])
 6    .then((results) => {
 7        results.forEach(result => console.log(result));
 8        // [
 9        //   { status: 'fulfilled', value: 1 },
10        //   { status: 'rejected', reason: 'Failed' },
11        //   { status: 'fulfilled', value: 3 }
12        // ]
13    });
  • Ang then() ay tinatawag kapag natapos na ang lahat ng mga Promise (natupad man o tinanggihan). Ang bawat resulta ay naglalaman ng status na property ('fulfilled' o 'rejected'). Ang mga pagkabigo ay hindi nakakaapekto sa ibang mga operasyon.

Promise.any()

Ang Promise.any ay naghihintay hanggang may unang matupad na Promise at ibinabalik ito.

 1const promise1 = new Promise((resolve) => setTimeout(() => resolve("A ok"), 300));
 2const promise2 = new Promise((_, reject) => setTimeout(() => reject("B fail"), 100));
 3const promise3 = new Promise((resolve) => setTimeout(() => resolve("C ok"), 200));
 4
 5Promise.any([promise1, promise2, promise3])
 6    .then(value => {
 7        // Logs the first fulfilled value ("C ok")
 8        console.log("first fulfilled:", value);
 9    })
10    .catch(err => {
11        console.log("should not reach here in this example:", err);
12    });
  • Ibinabalik nito ang unang natupad na halaga mula sa maraming Promises.

Buod

Sa paggamit ng TypeScript, maaari mong tukuyin ang uri ng mga Promises nang maayos, na nagpapahintulot sa iyo na magsulat ng mas ligtas na mga programa ayon sa uri. Nakakatulong ito sa maagang pagtukoy ng mga error habang nasa proseso ng pag-develop sa pamamagitan ng pagtukoy ng uri ng halaga na ibinabalik ng isang Promise nang maaga.

Maaari mong sundan ang artikulo sa itaas gamit ang Visual Studio Code sa aming YouTube channel. Paki-check din ang aming YouTube channel.

YouTube Video

Paghawak ng Error sa TypeScript