JavaScript で先行入力検索の約束をキャンセルするにはどうすればよいですか?

Promise - Promise を強制的にキャンセルすることは可能ですか

このシナリオでは、ユーザーは先行入力検索を実行しています。そしてキーストロークごとに新しいバックエンド呼び出しがトリガーされます。ユーザーの入力が速くなると、古いリクエストは無関係になり、キャンセルする必要があります。

ES6 の Promise は、現時点では、そのままではキャンセルをサポートしていません。ただし、ネットワーク リクエストなどの非同期操作をキャンセルできるクロスプラットフォーム プリミティブである AbortController を介したキャンセル機能を導入する作業が進行中です。

AbortController の使用

最新のアプローチとして、AbortController はシグナルを提供します。 Promise を返す関数をキャンセルするために使用できるオブジェクト。構文は次のようになります。

<code class="javascript">async function somethingIWantToCancel({ signal } = {}) {
  // Use the signal object to manually adapt code for cancellation support
  const onAbort = (e) => {
    // Handle cancellation logic here
  };
  signal.addEventListener('abort', onAbort, { once: true });
  try {
    const response = await fetch('...', { signal });
  } catch (e) {
    if (e.name === 'AbortError') {
      // Deal with cancellation in caller
    } else {
      throw e;
    }
  } finally {
    signal.removeEventListener('abort', onAbort);
  }
}</code>

この例では、somethingIWantToCancel 関数は、AbortController のインスタンスであるシグナル パラメーターを受け取ります。 signal.addEventListener リスナーは、操作がキャンセルされたときにトリガーされる中止イベントのイベント ハンドラーを登録します。 Finally ブロックは、操作が完了したときにイベント リスナーが確実に削除されるようにします。

代替手段

AbortController がオプションでない場合、別のアプローチは、Bluebird のようなサードパーティ ライブラリを使用することです。キャンセル機能を提供します。

もう 1 つの方法は、キャンセル トークンを使用することです。これには、リクエストをキャンセルするために呼び出すことができるメソッドに関数を渡すことが含まれます。

結論

ES6 Promise にはネイティブのキャンセル サポートがありませんが、AbortController やその他の代替手段が非同期操作をキャンセルする方法を提供します。最新のJavaScriptでは。古いシナリオの場合は、キャンセル トークンまたはサードパーティ ライブラリを使用することで解決策を提供できます。

以上がJavaScript で先行入力検索の約束をキャンセルするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。