Wie kapselt ein Versprechen Ajax? Implementierungsmethode der Versprechenskapselung Ajax

Der Inhalt dieses Artikels befasst sich mit der Frage, wie Versprechen Ajax kapselt. Die Implementierungsmethode von Promise Encapsulated Ajax hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen.

Zuerst den Code posten

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()

    })
}

Kommentare:

1, open(method, url, async)

Methode: GET und POST;

URL: an den Server gesendet

asynchron: asynchron true, synchronous false

2, onreadystatechange

Immer wenn sich der Wert von readyState ändert, führt die Funktion onreadystatechange automatisch

3, Antwortstatusinformationen des readyState-Servers aus

• 0: Die Anforderung wird nicht initialisiert

• 1: Die Serververbindung wurde hergestellt

• 2: Die Anfrage wurde empfangen

• 3: Die Anfrage wird verarbeitet

• 4: Die Anfrage wurde abgeschlossen und die Antwort ist bereit

Wenn der Wert von readyState 4 ist und der Status Ist 200, bedeutet dies, dass die entsprechende Antwort bereit ist und die Methode erfolgreich aufgerufen werden kann, andernfalls wird die Methode nicht aufgerufen

Das obige ist der detaillierte Inhalt vonWie kapselt ein Versprechen Ajax? Implementierungsmethode der Versprechenskapselung Ajax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!