ホームページ > ウェブフロントエンド > jsチュートリアル > Promise にチェーンされた .then() が Unknown を返すのはなぜですか?

Promise にチェーンされた .then() が Unknown を返すのはなぜですか?

Susan Sarandon
リリース: 2024-10-19 22:17:29
オリジナル
491 人が閲覧しました

Why Does .then() Chained to a Promise Return Undefined?

Promise にチェーンされた .then() が Unknown を返す理由

以下のコード スニペットを考えてみましょう:

<code class="js">function doStuff(n) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(n * 10);
    }, Math.floor(Math.random() * 1000));
  })
  .then((result) => {
    if (result > 100) {
      console.log(`${result} is greater than 100`);
    } else {
      console.log(`${result} is not greater than 100`);
    }
  });
}

doStuff(9)
.then((data) => {
  console.log(data); // undefined, why?
});</code>
ログイン後にコピー

2 番目の .then() コールバックでデータの値が定義されていないのはなぜですか?

答え:

.then() コールバックを Promise にチェーンすると、コールバックの戻り値に解決される新しい Promise を返します。ただし、提供されたコードでは、最初の .then() から値または Promise が返されません。

解決策:

問題を解決するには、次のコードを返す必要があります。値を取得するか、最初の .then() から値または Promise を返す別の関数を呼び出します。コードの更新バージョンは次のとおりです。

<code class="js">function doStuff(n) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(n * 10);
    }, Math.floor(Math.random() * 1000));
  })
  .then((result) => {
    if (result > 100) {
      console.log(`${result} is greater than 100`);
    } else {
      console.log(`${result} is not greater than 100`);
    }

    // Return `result` here to avoid undefined at chained `.then()`.
    return result;
  });
}

doStuff(9)
.then((data) => {
  console.log(`data is: ${data}`); // data is not undefined
});</code>
ログイン後にコピー

この更新されたコードでは、最初の .then() は result の値 (n を 10 倍したもの) を返します。これにより、2 番目の .then() は確実に結果を受け取ります。引数として定義された値。

以上がPromise にチェーンされた .then() が Unknown を返すのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート