JavaScript之封装Ajax函数

/**
 * 封装Ajax函数
 * @param {string} opt.url 发送请求的url
 * @param {string} opt.method http连接的方式，包括POST和GET两种方式
 * @param {boolean} opt.async 是否为异步，true为异步，false为同步
 * @param {object} opt.data 发送的参数，格式为对象类型
 * @param {function} opt.success ajax成功的回调函数
 * @param {function} opt.error ajax失败的回调函数
 */
var ajax=function(opt={}){
	// 初始化所有参数
	opt.url = opt.url || "";
	opt.method = opt.method || "GET";
	opt.async = opt.async || true;
	opt.data = opt.data || {};
	opt.success = opt.success || function (response) { console.log(response) };
	opt.error = opt.error || function (response) { console.log(response) };
	// console.log(opt);
	// 创建XMLHttpRequest对象
	let xmlHttp = null;
	if (XMLHttpRequest) {
	    xmlHttp = new XMLHttpRequest();
	} else {
	    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
	}
	// 整理参数
	let params = [];
	for (let key in opt.data) {
	    params.push(key + "=" + opt.data[key]);
	}
	const postData = params.join("&");
	// 发送请求
	// console.log(opt.method.toUpperCase());
	if (opt.method.toUpperCase() === "POST") {
	    xmlHttp.open("POST", opt.url, opt.async);
	    xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
	    xmlHttp.send(postData);
	} else if (opt.method.toUpperCase() === "GET") {
	    xmlHttp.open("GET", opt.url + '?' + postData, opt.async);
	    xmlHttp.send(null);
	}
	// 服务器响应
	xmlHttp.onreadystatechange = () => {
	    // 请求未初始化 xmlHttp.readyState==0
	    // 服务器连接已建立 xmlHttp.readyState==1
	    // 请求已连接 xmlHttp.readyState==2
	    // 请求处理中 xmlHttp.readyState==3
	    // 请求已完成且响应已就绪
	    if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
	        opt.success(xmlHttp.responseText);
	    }
	    // 未找到页面
	    else if (xmlHttp.readyState == 4 && xmlHttp.status == 404) {
	        opt.error(xmlHttp.responseText);
	    }
	
	}
}