使用帶有簡單回撥的 vanilla javascript 中的 ajax

這是我們建立一個用 vanilla javascript 編寫的簡單 ajax 呼叫的函式（不是 es2015）：

function ajax(url, callback) {
    var xhr;
     
    if(typeof XMLHttpRequest !== 'undefined') xhr = new XMLHttpRequest();
    else {
        var versions = ["MSXML2.XmlHttp.5.0", 
                        "MSXML2.XmlHttp.4.0",
                        "MSXML2.XmlHttp.3.0", 
                        "MSXML2.XmlHttp.2.0",
                        "Microsoft.XmlHttp"]

         for(var i = 0, len = versions.length; i < len; i++) {
            try {
                xhr = new ActiveXObject(versions[i]);
                break;
            }
            catch(e){}
         } // end for
    }
     
    xhr.onreadystatechange = ensureReadiness;
     
    function ensureReadiness() {
        if(xhr.readyState < 4) {
            return;
        }
         
        if(xhr.status !== 200) {
            return;
        }

        // all is well  
        if(xhr.readyState === 4) {
            callback(xhr);
        }           
    }
     
    xhr.open('GET', url, true);
    xhr.send('');
}

它可以用作：

ajax('myFile.html', function(response) {
    document.getElementById('container').innerHTML = response.responseText;
});

如果你想使用 Ecmascript 6（也稱為 es2015），你可以使用 fetch 方法，它返回一個 promise：

fetch('myFile.json').then(function(res){
    return res.json();
 });

有關 es2015 承諾的更多資訊，請點選下面的連結： Promises