[ Leksykon ] [ JavaScript ] [ Funkcje definiowane ] [ Promise() ]

async

[_] [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [K] [L] [M] [N] [O] [P] [Q] [R] [S] [T] [U] [V] [W] [X] [Y] [Z]

  

Przykłady:

const promiseA = new Promise((resolve) => setTimeout(() => resolve("zadanie A"), 1000));
const promiseB = new Promise((resolve) => setTimeout(() => resolve("zadanie B"), 5000));
const promiseC = new Promise((resolve, reject) => setTimeout(() => reject("zadanie C"), 1000));
const promiseD = new Promise((resolve, reject) => setTimeout(() => reject("zadanie D"), 5000));

function zadanie(zad) {
   const stat = { status: "pending" };

   return Promise.race([zad, stat]).then(
      (value) => value === stat ? value : { status: "fulfilled", value },
      (reason) => ({ status: "rejected", reason })
   );
}

async function zadania() {
   console.log(await zadanie(promiseA));
   console.log(await zadanie(promiseB));
   console.log(await zadanie(promiseC));
   console.log(await zadanie(promiseD));
}

zadania();

setTimeout(() => {
   console.log("Wykonane zadania po dwóch sekundach");
   zadania();
}, 2000);

// { status: 'pending' }
// { status: 'pending' }
// { status: 'pending' }
// { status: 'pending' }
// Wykonane zadania po dwóch sekundach
// { status: 'fulfilled', value: zadanie A }
// { status: 'pending' }
// { status: 'rejected', reason: zadanie C }
// { status: 'pending' }

  

function zadanieA() {
   console.log("start zadanieA");
   return new Promise((resolve) => {
      setTimeout(() => {
         resolve("zadanieA");
         console.log("zadanieA jest wykonywane");
      }, 5000);
   });
}

function zadanieB() {
   console.log("start zadanieB");
   return new Promise((resolve) => {
      setTimeout(() => {
         resolve("zadanieB");
         console.log("zadanieB jest wykonywane");
      }, 2000);
   });
}
function startA() {
   console.log("startA");
   return Promise.all([zadanieA(), zadanieB()]).then( // równoczesny start
      (messages) => {
         console.log(messages[0]); // slow
         console.log(messages[1]); // fast
      }
   );
}

async function startB() {
   console.log(" ");
   console.log("startB");
   await Promise.all([ // rozpoczęcie dwóch zadań równolegle, czekamy aż oba się zakończą
      (async () => console.log(await zadanieA()))(),
      (async () => console.log(await zadanieB()))(),
   ]);
}
console.log("start 1");
setTimeout(startA, 1000);
console.log("stop 1");

console.log("start 1");
setTimeout(startB, 10000);
console.log("stop 1");

// "start 1"
// "stop 1"
// "start 1"
// "stop 1"
// "startA"
// "start zadanieA"
// "start zadanieB"
// "zadanieB jest wykonywane"
// "zadanieA jest wykonywane"
// "zadanieA"
// "zadanieB"
// " "
// "startB"
// "start zadanieA"
// "start zadanieB"
// "zadanieB jest wykonywane"
// "zadanieB"
// "zadanieA jest wykonywane"
// "zadanieA"

  

async function pobieranie(plik, nazwa) {
   const test = await fetch(plik);
   if (!test.ok) {
      throw new Error("plik nie istnieje, status: ${response.status}");
   }
   const blobinfo = await response.blob();
   return [blobinfo, nazwa];
}
const fotoA = pobieranie("fotoa.jpg", "fotoA");
const fotoB = pobieranie("fotob.jpg", "fotoB");
const fotoC = pobieranie("fotoc.jpg", "fotoC");
Promise.any([fotoA, fotoB, fotoC]).then(([blob1, nazwa]) => {
   const objPlikuURL = URL.createObjectURL(blob1);
   const image = document.createElement("img");
   image.src = objPlikuURL;
   image.alt = nazwa;
   document.body.appendChild(image);
}).catch((e) => {
    console.error(e);
});

  

function zadanieB(x) {
   return new Promise((resolve) => {
      setTimeout(() => {
         resolve(x);
      }, 5000);
   });
}

async function zadanieA() {
   const x = await zadanieB(60);
   console.log(x); // po oczekiwaniu 5 sekundach await przekarze do console.log 60
}

zadanieA();

   

const dane = fetch("dane.json").then((response) => response.json());
export default await dane;

   

async function zadanie(name) {
   console.log(name, "1");
   await console.log(name, "2"); // dodatkowe taktowanie
   console.log(name, "3");
}

zadanie("krok");
zadanie("skok");

// dodatkowe taktowanie krok 1, krok 2, skok 1, skok 2, krok 3, skok 3

 

async function zadanieWA() {
   await null;
   throw new Error("NIE");
}

async function zadanieA() {
   return await zadanieWA(); 
   // await rozpakowujeie zadanieWA do zadanieA Error
   // natepmnie pakuje i zwraca zadanieA Error
}

zadanieA(); 
// Error: NIE
// zadanieWA
// async zadanieA

 

async function zadanieA() {
   const zadanie = {
      then(resolve, reject) {
         resolve("TAK");
      },
   };
   console.log(await zadanie); // "TAK"
}

async function zadanieA() {
   const zadanie = {
      then(resolve, reject) {
         reject(new Error("NIE"));
      },
   };
   console.log(await zadanie); // "NIE"
}

zadanieA();
zadanieB();

  

function zadanie() {
   return new Promise(resolve => {
      setTimeout(() => {
         resolve('resolved');
      }, 5000);
   });
}

async function asyncZadanie() {
   console.log('zadanie start');
   const result = await zadanie();
   console.log(result);
}

asyncZadanie();
// wynik: "resolved"

 

 

Opis:
Funkcja async(). Użycie async i await umożliwia użycie zwykłego try/catch wokół kodu asynchronicznego. Funkcje asynchroniczne zawsze zwracają obietnicę. Jeśli wartość zwracana przez funkcję asynchroniczną nie jest jawnie obietnicą, zostanie niejawnie opakowana w obietnicę. Funcja async return 5; upodobni to do return Promise.resolve(5) ale to przy operatorze === zwróci false; Operator await stosujemy go wewnątrz funkcji async. Operator await powoduje, że program czeka z przejściem do następnej linii kodu do momentu zakończenia się asynchronicznego zadania, za tym operatorem. Funkcje asynchroniczne mogą zawierać zero lub więcej await wyrażeń. Wyrażenia Await sprawiają, że funkcje zwracające obietnicę zachowują się tak, jakby były synchroniczne, wstrzymując wykonywanie do momentu spełnienia lub odrzucenia zwróconej obietnicy. Funkcja asynchroniczna bez wyrażenia await będzie działać synchronicznie. Jeśli jednak w treści funkcji znajduje się wyrażenie await, funkcja async zawsze zakończy się asynchronicznie.

Wyrażenie async function jest bardzo podobne i ma prawie taką samą składnię jak wyrażenie async function statement. Główną różnicą między function wyrażeniem asynchronicznym a function instrukcją asynchroniczną jest nazwa funkcji, którą można pominąć w async function wyrażeniach w celu utworzenia funkcji anonimowych. Wyrażenie async functionmoże być użyte jako IIFE, które jest uruchamiane natychmiast po zdefiniowaniu.

// wyrażenie funkcji asynchronicznej używane jako IIFE
(async function (x) {
   const zA = zadanieA(50);
   const zB = zadanieB(10);
   return z + (await zA) + (await zB);
})(50).then((z) => {
   console.log(z);
})

 

Linki: