JavaScript PromiseとAsync/Awaitの詳細な説明

新しいPromise(function(resolve,reject) {
    if (/* 非同期操作が成功しました*/) {
        resolve(value); // Promiseの状態をパディングから実行済みに変更する
    } それ以外 {
        拒否(エラー); // Promise の状態をパディングから拒否に変更します
    }
})
実装には3つのプロトタイプメソッドがあります: then、catch、finally
約束
.then((結果) => {
    //promise が受け入れられるか拒否されて実行が続行されます})
.catch((エラー) => {
    //promise は拒否されます})
.finally (() => {
    //promise が満たされると、とにかく実行されます})

定数 onMyBirthday = (isKayoSick) => {
  新しい Promise を返します ((resolve, reject) => {
    タイムアウトを設定する(() => {
      if (!isKayoSick) {
        解決する(2);
      } それ以外 {
        拒否(新しいエラー("悲しいです"));
      }
    }, 2000);
  });
};

私の誕生日(false)
  .then((結果) => {
    console.log(`I have ${result} cakes`); // コンソールに「I have 2 cakes」と表示される 
  })
  .catch((エラー) => {
    console.log(error); // 実行されませんでした})
  .finally(() => {
    console.log("Party"); // コンソールに「Party」と表示される
  });

私の誕生日に(true)
  .then((結果) => {
    console.log(`I have ${result} cakes`); // 実行されませんでした})
  .catch((エラー) => {
    console.log(error); // コンソールに「I'm sad」と表示される
  })
  .finally(() => {
    console.log("Party"); // コンソールに「Party」と表示される
  });

const 入力番号 = () => {
  新しい Promise を返します ((resolve, reject) => {
    // ここからコーディングを開始します });
};

const 入力番号 = () => {
  新しい Promise を返します ((resolve, reject) => {
    const userNumber = Number(window.prompt("数字を入力してください (1 - 6):")); // ユーザーに数字を尋ねます const randomNumber = Math.floor(Math.random() * 6 + 1); // 1 から 6 までのランダムな数字を選択します });
};

const 入力番号 = () => {
  新しい Promise を返します ((resolve, reject) => {
    const userNumber = Number(window.prompt("数字を入力してください (1 - 6):")); // ユーザーに数字を尋ねます const randomNumber = Math.floor(Math.random() * 6 + 1); // 1 から 6 までのランダムな数字を選択します if (isNaN(userNumber)) {
      拒否(new Error("入力タイプが正しくありません")); // ユーザーが入力した値が数値でない場合は例外がスローされ、拒否関数が呼び出されます}
  });
};

新しい Promise を返します ((resolve, reject) => {
  const userNumber = Number(window.prompt("数字を入力してください (1 - 6):")); // ユーザーに数字を尋ねます const randomNumber = Math.floor(Math.random() * 6 + 1); // 1 から 6 までのランダムな数字を選択します if (isNaN(userNumber)) {
    拒否(new Error("入力タイプが正しくありません")); // ユーザーが入力した値が数値でない場合は例外がスローされ、拒否関数が呼び出されます}
 
  if (ユーザー番号 === ランダム番号) {
    // 等しい場合は、ユーザーに 2 ポイントを与えます。resolve({
      ポイント: 2,
      ランダム番号、
    });
  } それ以外の場合 (
    ユーザー番号 === ランダム番号 - 1 ||
    ユーザー番号 === ランダム番号 + 1
  ）{
    // userNumber と randomNumber の差が 1 の場合、ユーザーに 1 ポイントを与えます。resolve({
      ポイント: 1,
      ランダム番号、
    });
  } それ以外 {
    // それ以外の場合、ユーザーは 0 ポイントを獲得します。resolve({
      ポイント: 0,
      ランダム番号、
    });
  }
});

const 継続ゲーム = () => {
  新しいPromise((resolve) => {を返す
    if (window.confirm("続行しますか?")) { // ユーザーにゲームを続行するかどうかを尋ねます。resolve(true);
    } それ以外 {
      解決(偽);
    }
  });
};

const ハンドル推測 = () => {
  enterNumber() // Promiseオブジェクトを返します。then((result) => {
      alert(`Dice: ${result.randomNumber}: you got ${result.points} points`); // 解決が実行されると、ユーザーのスコアと乱数を取得します // ユーザーにゲームを続行するかどうかを尋ねます continueGame().then((result) => {
        if (結果) {
          handleGuess(); // はいの場合、ゲームは続行されます } else {
          alert("ゲーム終了"); // いいえの場合はゲーム終了ボックスを表示します}
      });
    })
    .catch((エラー) => alert(エラー));
};
 
handleGuess(); // handleGuess関数を実行する

const handleGuess = 非同期() => {
  試す {
    const result = await enterNumber(); // then メソッドの代わりに、結果を直接取得するには promise の前に await を置く必要があります。alert(`Dice: ${result.randomNumber}: you got ${result.points} points`);
 
    const isContinuing = continueGame() を待機します。
 
    継続中の場合
      ハンドル推測();
    } それ以外 {
      alert("ゲーム終了");
    }
  } catch (error) { // catch メソッドは try、catch 関数 alert(error); に置き換えることができます。
  }
};

const 入力番号 = () => {
  新しい Promise を返します ((resolve, reject) => {
    const userNumber = Number(window.prompt("数字を入力してください (1 - 6):")); // ユーザーに数字を尋ねます const randomNumber = Math.floor(Math.random() * 6 + 1); // システムは 1 から 6 までの数字をランダムに選択します if (isNaN(userNumber)) {
      拒否(new Error("入力タイプが間違っています")); // ユーザーが数字以外の数字を入力した場合、エラーが発生します}
 
    if (userNumber === randomNumber) { // ユーザーが数字を正しく推測した場合、ユーザーに2ポイントを与えます。resolve({
        ポイント: 2,
        ランダム番号、
      });
    } それ以外の場合 (
      ユーザー番号 === ランダム番号 - 1 ||
      ユーザー番号 === ランダム番号 + 1
    ) { // userNumber が randomNumber と 1 異なる場合、ユーザーに 1 ポイントを与えます。resolve({
        ポイント: 1,
        ランダム番号、
      });
    } else { // 不正解、スコア0 解決({
        ポイント: 0,
        ランダム番号、
      });
    }
  });
};
 
const 継続ゲーム = () => {
  新しいPromise((resolve) => {を返す
    if (window.confirm("続行しますか?")) { // ユーザーにゲームを続行するかどうかを尋ねます。resolve(true);
    } それ以外 {
      解決(偽);
    }
  });
};
 
const handleGuess = 非同期() => {
  試す {
    const result = await enterNumber(); // await は then 関数を置き換えます alert(`Dice: ${result.randomNumber}: you got ${result.points} points`);
 
    const isContinuing = continueGame() を待機します。
 
    継続中の場合
      ハンドル推測();
    } それ以外 {
      alert("ゲーム終了");
    }
  } catch (error) { // catch メソッドは try、catch 関数 alert(error); に置き換えることができます。
  }
};
 
handleGuess(); // handleGuess関数を実行する

const fetchData = 非同期() => {
  const res = await fetch("https://restcountries.eu/rest/v2/alpha/cn"); // fetch() は Promise を返すので、それを待つ必要があります
 
  const country = await res.json(); // res は HTTP レスポンスのみなので、res.json() を呼び出す必要があります。
 
  console.log(country); // 中国のデータは開発コンソールに記録されます
};
 
フェッチデータ();

// タスク 4: 中国の近隣諸国に関する情報を取得する const fetchCountry = async (alpha3Code) => {
  試す {
    const res = フェッチを待つ(
      `https://restcountries.eu/rest/v2/alpha/${alpha3Code}`
    );
 
    const データ = res.json() を待機します。
 
    データを返します。
  } キャッチ（エラー）{
    コンソール.log(エラー);
  }
};

const fetchCountryAndNeighbors = 非同期 () => {
  const 中国 = fetchCountry("cn") を待機します。
 
  console.log(中国);
};
 
国と近隣地域を取得します。

const neighbors =china.borders.map((border) => fetchCountry(border));

const fetchCountryAndNeigbors = 非同期 () => {
  const 中国 = fetchCountry("cn") を待機します。
 
  const neighbors = await Promise.all(
    china.borders.map((border) => fetchCountry(border))
  );
 
  console.log(近隣);
};
 
国と地域の情報をフェッチします。

const fetchCountry = async (alpha3Code) => {
  試す {
    const res = フェッチを待つ(
      `https://restcountries.eu/rest/v2/alpha/${alpha3Code}`
    );
    const データ = res.json() を待機します。
    データを返します。
  } キャッチ（エラー）{
    コンソール.log(エラー);
  }
};
 
const fetchCountryAndNeigbors = 非同期 () => {
  const 中国 = fetchCountry("cn") を待機します。
  const neighbors = await Promise.all(
    china.borders.map((border) => fetchCountry(border))
  );
  console.log(近隣);
};
 
国と地域の情報をフェッチします。