什么是AJAX

Ajax全称为Asynchronous JavaScript and XML（异步JavaScript和XML），是一种使用Web技术，无需刷新页面，即可与服务器交互获取数据的方法。简单来说，它是利用JavaScript的XMLHttpRequest对象向服务器异步请求数据，然后使用DOM技术更新HTML页面显示内容的一种技术。使用Ajax可以给用户带来更好的用户体验，同时也可以减轻服务器的压力，提高Web应用程序的性能。

发送参数

async function sendData(data) {
    var xhr = new XMLHttpRequest();
    var url = 'https://127.0.0.1:44300';
    return new Promise((resolve, reject) => {
        xhr.onreadystatechange = (e) => {
            if (xhr.readyState !== 4) {
                return
            }
            if (xhr.status === 200) {
                resolve(xhr.responseText)
            } else {
                console.warn('request_error：' + xhr.status)
        }
    };
    //设置请求方式和请求的接口地址
    xhr.open('GET', url, true);
    //设置请求头
    xhr.setRequestHeader('Content-type', 'application/json');
    //发送数据
    xhr.send(data);
})
}
//IIFE调用方式
(async function(){var res = await sendData('noteDataType=2&dateType=2'); console.log(res); return res;})();

发送表单数据

var data = {'nickname':'Cloud','id':'Cloud','password':'Cloud'};
async function sendData(data) { 
var urlEncodedData='';
var urlEncodedDataPairs=[];
var name;
for(name in data) {
urlEncodedDataPairs.push(encodeURIComponent(name)+'='+encodeURIComponent(data[name]))
}
urlEncodedData=urlEncodedDataPairs.join('&').replace(/%20/g,'+');
var xhr=new XMLHttpRequest();
var url='https://127.0.0.1:44300';
return new Promise((resolve,reject) => { 
xhr.onreadystatechange = (e) => { 
        if (xhr.readyState !== 4) { 
            return
    }
    if (xhr.status === 200) { 
        resolve(xhr.responseText)
    }
    else {
            console.warn('request_error:' + xhr.status)
    }
};
    xhr.open('POST',url,true);
    xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
    xhr.send(urlEncodedData)
})
}
//IIFE调用方式
(async function(){var res = await sendData(data); return res})();

表单数据

async function upload(data) {
    var formData=new FormData();
    var name;
    for(name in data) {
        formData.append(name, data[name]);
    }
    var xhr=new XMLHttpRequest();
    var url='https://127.0.0.1:44300';
    return new Promise((resolve,reject) => {
        xhr.onreadystatechange = (e) => {
            if (xhr.readyState !== 4) {
                return
            }
            if (xhr.status === 200) {
                resolve(xhr.responseText)
            }
            else {
                console.warn('errcode:' + xhr.status)
            }
        };
        xhr.open('POST', url,true);
        xhr.setRequestHeader('Content-type','multipart/form-data');
        xhr.send(formData)
    })
}