objavlenie_promisi

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слева Предыдущая версия
Следующая версия
Предыдущая версия
objavlenie_promisi [2024/01/11 07:55]
tro
objavlenie_promisi [2024/01/25 19:27] (текущий)
tro
Строка 6: Строка 6:
   * отклонен (reject)   * отклонен (reject)
 ===== обявление промиса (Promise) ===== ===== обявление промиса (Promise) =====
 +При створенні промісу всередині буде відразу вконана та дія. Сюди загоняємо те що повинно буде виконано у промісі.
 <code> <code>
 const myPromise = new Promise ((resolve, reject)=>{ const myPromise = new Promise ((resolve, reject)=>{
Строка 12: Строка 13:
 </code> </code>
 ===== Обробка резуьтата промиса (.then) ===== ===== Обробка резуьтата промиса (.then) =====
 +В методах then прописуємо що буде виконано коли настане подія вдалого,невдалого або просто факта виконання проміса
 +<code>
 +promise.then(onFullFild).catch(onReject);
 +</code>
 <code> <code>
 myPromse myPromse
Строка 47: Строка 52:
 </code> </code>
 У змінну promise буде записаний проміс (об'єкт) у стані pending, а через дві секунди, щойно буде викликаний resolve() або reject(), проміс перейде у стан fulfilled або rejected, і ми зможемо його обробити. Якщо функції onResolve і onReject містять складну логіку, їх для зручності оголошують як зовнішні функції і передають у метод then() за ім'ям. У змінну promise буде записаний проміс (об'єкт) у стані pending, а через дві секунди, щойно буде викликаний resolve() або reject(), проміс перейде у стан fulfilled або rejected, і ми зможемо його обробити. Якщо функції onResolve і onReject містять складну логіку, їх для зручності оголошують як зовнішні функції і передають у метод then() за ім'ям.
 +
 +
 ===== Обробка помилки catch() ===== ===== Обробка помилки catch() =====
  
Строка 75: Строка 82:
 </code> </code>
  
-===== Іньші приклади =====+===== Метод finally() ===== 
 +метод може бути корисним, якщо необхідно виконати код після того, як проміс буде виконаний незалежно від результату (fulfilled або rejected). 
 +Колбек-функція не отримає жодних аргументів, оскільки неможливо визначити, чи був проміс виконаний або відхилений. Тут буде виконуватися код, який необхідно запустити в будь-якому разі. 
 +<code> 
 +promise 
 + .then(value => { 
 +   // Promise fulfilled 
 + }) 
 + .catch(error => { 
 +   // Promise rejected 
 + }) 
 + .finally(() => { 
 +   // Promise fulfilled or rejected 
 + }); 
 +</code> 
 +<code> 
 +const isSuccess true;
  
 +// Create promise
 +const promise = new Promise((resolve, reject) => {
 +  setTimeout(() => {
 +    if (isSuccess) {
 +      resolve("Success! Value passed to resolve function");
 +    } else {
 +      reject("Error! Error passed to reject function");
 +    }
 +  }, 2000);
 +});
  
 +// Registering promise callbacks
 +promise
 +  .then(value => console.log(value)) // "Success! Value passed to resolve function"
 +  .catch(error => console.log(error)) // "Error! Error passed to reject function"
 +  .finally(() => console.log("Promise settled")); // "Promise settled"
 +</code>
 +===== Ланцюжки промісів then() =====
 +Метод then() повертає новий проміс, який у свою чергу отримує значення від своєї callback-функції onResolve. Ця особливість дозволяє формувати послідовність асинхронних операцій, зв'язуючи проміси в ланцюжок.
 +<code>
 +const promise = new Promise((resolve, reject) => {
 +  setTimeout(() => {
 +    resolve(5);
 +  }, 2000);
 +});
 +
 +promise
 +  .then(value => {
 +    console.log(value); // 5
 +    return value * 2;
 +  })
 +  .then(value => {
 +    console.log(value); // 10
 +    return value * 3;
 +  })
 +  .then(value => {
 +    console.log(value); // 30
 +  })
 +  .catch(error => {
 +    console.log(error);
 +  })
 +  .finally(() => {
 +    console.log("finally");
 +  });
 +</code>
 +===== Promise.resolve() і Promise.reject() =====
 + статичні методи для швидкого створення промісів, що миттєво успішно виконуються або відхиляються. Вони працюють аналогічно new Promise(), повертають проміс, але мають коротший синтаксис.
 +  * Так створюється успішно виконаний проміс через Promise.resolve():
 +<code>
 +Promise.resolve("success value");
 + .then(value => console.log(value));
 + .catch(error => console.log(error));
 +</code>
 +  * Так створюється проміс, що виконався з помилкою через Promise.reject():
 +<code>
 +Promise.reject("error");
 + .then(value => console.log(value));
 + .catch(error => console.log(error));
 +</code>
 +===== Promise.all() (Обробка множинних промісів) =====
 +Є ситуації, коли потрібно чекати на виконання всіх промісів одночасно, а потім обробляти їх результати. Або ситуації, коли достатньо дочекатися виконання хоча б одного з них, ігноруючи інші випадки. Для цих сценаріїв клас Promise має статичні методи для роботи з групою промісів.
 +Метод Promise.all() **дозволяє одночасно обробити кілька промісів та отримати їхні результати**. Він приймає масив промісів як вхідні дані, чекає їх виконання та повертає один проміс.
 +Якщо всі проміси виконуються успішно, повернений проміс перейде у стан fulfilled, а його значенням буде масив результатів виконання кожного промісу.
 +
 +<code>
 +const p1 = Promise.resolve(1);
 +const p2 = Promise.resolve(2);
 +const p3 = Promise.resolve(3);
 +
 +Promise.all([p1, p2, p3])
 + .then(values => console.log(values)); // [1, 2, 3]
 + .catch(error => console.log(error));
 +</code>
 + **якщо хоча б один з промісів відхиляється, повернений проміс одразу переходить у стан rejected, а його значенням буде помилка**.
 +===== Promise.allSettled() =====
 +Також дозволяє одночасно обробити кілька промісів та отримати їхні результати.
 +Відмінність від Promise.all полягає в тому, що метод Promise.allSettled() **чекає виконання всіх промісів незалежно від того, чи були деякі або навіть всі проміси відхилені**.
 +===== Promise.race =====
 +приймає масив промісів і повертає "найшвидший", тобто перший виконаний або відхилений проміс з переданих, разом зі значенням або причиною його відхилення.
 +<code>
 +const p1 = new Promise((resolve, reject) => {
 +  setTimeout(() => resolve(1), 1000);
 +});
 +
 +const p2 = new Promise((resolve, reject) => {
 +  setTimeout(() => reject(2), 2000);
 +});
 +
 +Promise.race([p1, p2])
 + .then(value => console.log(value)); // 1
 + .catch(error => console.log(error));
 +</code>
 +
 +===== Іньші приклади =====
   * Приклад 2 (web)   * Приклад 2 (web)
 <code> <code>
  • /sites/data/attic/objavlenie_promisi.1704959759.txt.gz
  • Последнее изменение: 2024/01/11 07:55
  • tro