JS の 3 つの主要な問題、非同期性とシングルスレッドについて簡単に説明します。

シングルスレッド

しかし、開発中にネットワーク リクエストやスケジュールされたタスクに遭遇した場合、ネットワーク リクエストの終了やスケジュールされたタスクの終了を待ってから他の処理を実行すると、ページが停止してしまうため、js にはこの問題を解決するための非同期メカニズムが備わっています。

非同期

非同期の特徴は、後続のコード実行をブロックしないことです。非同期タスクは、同期タスクが完了した後に実行されます。対照的に、同期はコードの実行をブロックします。非同期タスクのアプリケーションには、主にネットワーク要求とスケジュールされたタスクが含まれます。

非同期はコールバックによって実現され、非同期実行コードはコールバック内で実行されます。ただし、3 つのネットワーク リクエスト abc を順番に実行する必要があるなどのシナリオもあります。a のコールバックでリクエスト b を開始し、b のコールバックでリクエスト c を開始します。これにより、コールバック地獄と呼ばれる非常にわかりにくい記述方法が発生します。ページ ロジックが複雑すぎて、10 個のインターフェイスを順番に呼び出す必要がある場合、コードの可読性が非常に悪くなることを想像してください。このようなコードを他人から見ると、心の中で千匹の獣が走り回っているのを感じずにはいられません。

promise の基本的な使用法:

fun1 = function(flag){とします。
    新しい Promise を返します ((resolve,reject)=>{
    if(フラグ){
        タイムアウトを設定する(() => {
        解決("成功")
        }, 1000);
    }それ以外{
        タイムアウトを設定する(() => {
        拒否("失敗")
        }, 1000);
    }
    })
}
　
 fun1(true).then((res)=>{
    console.log(res) //成功
}).catch((res)=>{
    コンソール.log(res)
})
fun1(false).then((res)=>{
    コンソール.log(res)
}).catch((res)=>{
    console.log(res) //失敗
})

上記は最も単純な promise 関数です。promise 関数は Promise オブジェクトを返します。パラメータは、resolve と reject の 2 つのパラメータを受け取る関数です。この 2 つのパラメータも関数です。resolve() または reject() が実行されると、関数が返されます。

resolve() が実行されると、then() メソッドが呼び出されたときに実行され、resolve() によって返されたパラメータを受け取ります。

reject() が実行されると、呼び出されたときに catch() メソッドが実行され、reject() によって返されたパラメータを受け取ります。

上記の 3 つのネットワーク要求の問題を再実装するには、promise を使用します。

callService = function(url){
      新しい Promise を返します ((resolve,reject)=>{
          axios.get(url).then((res)=>{
            解決する
          }).catch((err)=>{
            拒否(エラー)
          })
      
      })
    }
    定数 url1 = "/user/url1"
    定数 url2 = "/user/url2"
    定数 url3 = "/user/url3"
    callService(url1).then((res)=>{
      // 何かをする
      callService(url2) を返す
    }）。そして（）=>{
      // 何かをする
      callService(url3) を返します
    }).then((res)=>{
      // 何かをする
    }).catch((err)=>{
      コンソール.log(エラー)
    })

上記の方法を使用して再実装すると、記述層は 1 つだけになり、コールバックの層に陥ることはありません。

約束。すべて

promise.all は複数のプロミスを新しいインスタンスにラップし、成功した場合は配列を返し、最初に失敗したプロミスの値を返します。

promise.all メソッドは、日常の開発で複数のインターフェースを同時に呼び出す問題に対処するのに役立ちます。

p1 = new Promise((resolve, reject) => {とする
  解決('成功')
})

p2 = new Promise((resolve, reject) => { とする
  解決('成功')
})

Promise.all([p1, p2]).then((結果) => {
  console.log(結果) //['成功', '成功']
}).catch((エラー) => {
  コンソール.log(エラー)
})

約束.レース

このメソッドの機能は、複数のインターフェースを競合で実行し、より速く実行されるインターフェースを返すことです。

Promise.race([p1, p2]).then((結果) => {
  console.log(結果)
}).catch((エラー) => {
  コンソール.log(エラー) 
})

上記は、JS の 3 大課題である非同期性とシングルスレッドについて簡単に説明したものです。JS の 3 大課題である非同期性とシングルスレッドについての詳細は、123WORDPRESS.COM の関連記事をご覧ください。