意外と難しくないPromiseとawait[初心者向け]

初見でうげげとなる非同期処理ですが以外と難しくない！

順番に見てみましょう

【Promise】

Promiseは非同期操作の最終的な完了または失敗を表すオブジェクトであり、その結果の値を返します。Promiseは3つの状態を持つことができます：

Pending（未解決）: Promiseがまだ結果を生成していない状態
Fulfilled（解決済み）: Promiseが操作を正常に完了し、結果を生成した状態
Rejected（拒否）: Promiseが何らかのエラーにより操作を完了できなかった状態
Promiseは.thenメソッドを使って操作が完了した後の処理を記述できます。.catchメソッドはエラーが発生した場合に処理を捉えます。以下にサンプルコードを示します。

let promise = new Promise((resolve, reject) => {
    let condition = true; // ある条件

    if(condition) {
        resolve('Promise fulfilled'); // 条件が真なら、Promiseを解決
    } else {
        reject('Promise rejected'); // 条件が偽なら、Promiseを拒否
    }
});

promise
    .then((message) => {
        console.log(message); // 'Promise fulfilled'
    })
    .catch((error) => {
        console.error(error); // 'Promise rejected'
    })

【async/await】
async/awaitはPromiseをより直感的に扱うための構文糖です。asyncは関数を非同期関数にし、awaitはPromiseの解決を待ちます。この結果、非同期コードを同期的に書くことができ、コードの可読性が向上します。

async function asyncFunc() {
    try {
        let result = await promise; // promiseは非同期処理を行い、Promiseを返す関数
        console.log(result); // Promiseが解決されるとその結果を表示
    } catch (error) {
        console.error(error); // Promiseが拒否された場合、エラーを捕捉
    }
}

asyncFunc();