Промисы – это важная функция JavaScript, помогающая управлять асинхронными операциями и обрабатывать их результаты. Они позволяют писать более чистый и читаемый код при работе с задачами, выполнение которых может занять некоторое время, например выполнение запросов API или выполнение трудоемких операций.

В этом сообщении блога мы рассмотрим основы промисов и продемонстрируем их использование на примерах кода.

Давайте начнем!!! 🚀🚀

Содержание

  • Создание обещания
  • Выполнение обещания
  • Цепочка обещаний
  • Выполнение функций в Resolve
  • Обработка отказа с помощью Catch
  • Цепочка нескольких промисов
  • Использование JSONPlaceholder API для тестирования

1. Создание обещания

const count = false;

let countValue = new Promise(function(resolve, reject) {
    if (count) {
        resolve('There is a count value.');
    } else {
        reject('There is no count value.');
    }
});

В этом примере мы создаем обещание countValue, представляющее асинхронную операцию. Если count равно true, обещание разрешается с сообщением "Есть значение счетчика". В противном случае он отклоняется с сообщением «Нет значения счетчика». Вы можете console.log(countValue) заявление, чтобы увидеть результат.

2. Выполнение обещания

let promise = new Promise(function(resolve, reject) {
    setTimeout(() => reject(new Error('Whoops')), 1000);
});

Здесь мы создаем обещание promise, которое выполняется с задержкой в ​​5 секунд (5000 миллисекунд). После разрешения он записывает в консоль сообщение об успешном завершении.

3. Отказ от обещания

let promise = new Promise(function(resolve, reject) {
    setTimeout(() => reject(new Error('Whoops')), 1000);
});

В этом примере промис promise отклоняется после задержки в 1 секунду (1000 миллисекунд) с объектом Error, содержащим сообщение «Упс». Вы можете обработать отклонение с помощью метода catch, который мы увидим в примере 5.

3: Цепочка обещаний

const promise = doSomething();

const promise2 = promise2.then(successCallback, failureCallback);

// simplified
const promise3 = doSomething().then(successCallback, failureCallback);

Обещания могут быть объединены в цепочку для выполнения последовательности асинхронных задач. В этом примере doSomething() представляет собой первую асинхронную задачу, которая возвращает обещание. Затем мы связываем метод then для обработки разрешенного значения (successCallback) или отклоненного значения (failureCallback) обещания.

4: Выполнение функций при разрешении

let exampleTask = new Promise(function(resolve, reject) {
    resolve('Promise resolved');
});

exampleTask.then(function successValue1(result){
    console.log(result);
}).then(function successValue2(){
    console.log('You can call multiple functions this way');
});

В этом примере обещание exampleTask разрешено успешно, и мы используем метод then для выполнения функции successValue1, которая регистрирует разрешенный результат. Мы также можем объединить несколько методов then для последовательного вызова нескольких функций.

5: Обработка отказа с помощью Catch

let exampleTask = new Promise(function(resolve, reject) {
    reject('Promise rejected');
});

exampleTask.then(function successValue1(result){
    console.log(result);
}).catch(function errorValue(result){
    console.log(result);
});

В этом примере обещание exampleTask отклонено, и мы обрабатываем отклонение с помощью метода catch. Выполняется функция errorValue, протоколируя отклоненный результат. Использование catch позволяет нам централизованно обрабатывать ошибки.

6: Использование «Наконец»

let countValue = new Promise(function(resolve, reject) {
    reject("Promise rejected");
});

countValue.then((success) => {})
    .catch((error) => {
        console.log(error);
    })
    .finally(function greet(){
        console.log("This code is executed.");
    });

Метод finally используется для выполнения функции независимо от того, разрешено ли обещание или отклонено. В этом примере функция greet выполняется всегда, независимо от результата промиса.

7. Объединение нескольких обещаний

examplePromiseTask()
    .then(function (result) {
        return secondTask();
    })
    .then(function (result) {
        return thirdTask(); 
    })
    .catch(function (err) {
        // Handle any errors here
    });

Обещания могут быть объединены в цепочку для последовательного выполнения нескольких асинхронных задач. В этом примере сначала выполняется examplePromiseTask, затем secondTask, а затем thirdTask. Если какое-либо обещание в цепочке отклонено, для обработки ошибки вызывается метод catch.

Использование JSONPlaceholder API для тестирования

Чтобы продемонстрировать использование промисов с реальным API, вы можете интегрировать API JSONPlaceholder в свои примеры кода. JSONPlaceholder предоставляет набор фиктивных конечных точек для целей тестирования.

Например, вы можете заменить doSomething() в примере 3 вызовом API:

function doSomething() {
    return fetch('https://jsonplaceholder.typicode.com/posts/1')
        .then(response => response.json());
}

Точно так же вы можете изменить другие примеры, чтобы включить запросы API и соответствующим образом обрабатывать возвращаемые данные или ошибки.

Заключение

Промисы — это мощный инструмент в JavaScript для управления асинхронными операциями. Они упрощают обработку асинхронного кода и упрощают анализ сложных потоков. Понимая и практикуясь с промисами, вы можете писать более эффективный и удобный в сопровождении код на JavaScript.

Удачного программирования!💻

Также, если вам нужна дополнительная помощь, посмотрите это видеоИзучите JavaScript Promises за 19 минут (для начинающих) от Сонни Санги на Youtube.

Спасибо за ваше время ♥

Где меня найти 👇

Здесь на Медиуме♥️

Вы также можете меня найти 👉 Github https://github.com/Onlynfk/
Instagram / LinkedIn