Promise はどのようにして ajax をカプセル化しますか? Promiseカプセル化ajaxの実装方法

この記事の内容は、promise がどのように ajax をカプセル化するかについてです。 ajax をカプセル化した Promise の実装方法は参考になります。

最初にコードを投稿します

var ajaxOptions = {
    url: 'url',
    method: 'GET',
    async: true,
    data: null,
    dataType: 'text',
}

function ajax(protoOptions) {
    var options = {};

    for(var i in ajaxOptions){
        options[i] = protoOptions[i] || ajaxOptions[i];
    }
    

    return new Promise(function(resolve, reject){
        var xhr = new XMLHttpRequest();

        xhr.open(options.method, options.url, options.async);

        xhr.onreadystatechange = function() {
            if (this.readyState === 4 && this.status === 200) {
                resolve(this.responseText, this);
            } else {
                var resJson = {
                    code: this.status,
                    response: this.response
                }
                reject(resJson, this)
            }
        }

        xhr.send()

    })
}

コメント:

1, open(method, url, async)

メソッド: GET および POST;

url: サーバーに送信される URL;

async: 非同期 true、同期 false;

2,onreadystatechange

readyState の値が変更されるたびに、onreadystatechange 関数が自動的に実行されます

3、readyState サーバーの応答ステータス情報

• 0: リクエストは初期化されていません

• 1: サーバー接続が確立されました

• #2: リクエストが受信されました

• #3:リクエストは処理中です

• 4: リクエストは完了し、レスポンスは準備完了です

#readyState の値が 4 で、ステータスが 200 の場合、対応する応答の準備ができており、メソッドの呼び出しが成功したことを意味します。そうでない場合は、メソッドの呼び出しが失敗します。

以上がPromise はどのようにして ajax をカプセル化しますか? Promiseカプセル化ajaxの実装方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。