在做項目的時候，有時候需要用到異步數(shù)據(jù)請求，但是如果這個時候沒有框架的依賴，就需要用到原生JS進(jìn)行異步數(shù)據(jù)請求。這時候無非有兩種請求方式，一種是AJAX，另一個是JSONP。通過原生JS對異步請求進(jìn)行簡單的封裝。

AJAX

　　AJAX是一種數(shù)據(jù)請求方式，不需要刷新整個頁面就能夠更新局部頁面的數(shù)據(jù)。AJAX的技術(shù)核心是XMLHttpRequest對象，主要請求過程如下：

　　不說話直接貼代碼

/*** 通過JSON的方式請求* @param {[type]} params [description]* @return {[type]}  [description]*/ajaxJSON(params) { params.type = (params.type || 'GET').toUpperCase(); params.data = params.data || {}; var formatedParams = this.formateParams(params.data, params.cache); var xhr; //創(chuàng)建XMLHttpRequest對象 if (window.XMLHttpRequest) {  //非IE6  xhr = new XMLHttpRequest(); } else {  xhr = new ActiveXObject('Microsoft.XMLHTTP'); } //異步狀態(tài)發(fā)生改變，接收響應(yīng)數(shù)據(jù) xhr.onreadystatechange = function() {  if (xhr.readyState == 4 && xhr.status == 200) {   if (!!params.success) {    if (typeof xhr.responseText == 'string') {     params.success(JSON.parse(xhr.responseText));    } else {     params.success(xhr.responseText);    }   }  } else {   params.error && params.error(status);  } } if (params.type == 'GET') {  //連接服務(wù)器  xhr.open('GET', (!!formatedParams ? params.url + '?' + formatedParams : params.url), true);  //發(fā)送請求  xhr.send(); } else {  //連接服務(wù)器  xhr.open('POST', params.url, true);  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');  //發(fā)送請求  xhr.send(formatedParams); }},/*** 格式化數(shù)據(jù)* @param {Obj}  data 需要格式化的數(shù)據(jù)* @param {Boolean} isCache 是否加入隨機參數(shù)* @return {String}   返回的字符串*/formateParams: function(data, isCache) { var arr = []; for (var name in data) {  arr.push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name])); } if (isCache) {  arr.push('v=' + (new Date()).getTime()); } return arr.join('&');}

　　IE7及其以上版本中支持原生的 XHR 對象，因此可以直接用：var oAjax = new XMLHttpRequest();。IE6及其之前的版本中，XHR對象是通過MSXML庫中的一個ActiveXObject對象實現(xiàn)的。

　　通過xhr的open函數(shù)來連接服務(wù)器，主要接收三個參數(shù)：請求方式、請求地址和是否異步請求（一般都是異步請求）。請求方式有兩種，GET和POST，GET是通過URL將數(shù)據(jù)提交到服務(wù)器的，POST則是通過將數(shù)據(jù)作為send方法的參數(shù)發(fā)送到服務(wù)器。

　　給xhr綁定狀態(tài)改變函數(shù)onreadystatechange，主要用來檢測xhr的readyState的變化，當(dāng)異步發(fā)送成功后，readyState的數(shù)值會由0變成4，同時觸發(fā)onreadystatechange事件。readyState的屬性及對應(yīng)狀態(tài)如下：