使用Promise封裝簡單Ajax方法

? ? ? ?Promise 是異步編程的一種解決方案,比傳統(tǒng)的解決方案——回調(diào)函數(shù)和事件——更合理和更強大。它由社區(qū)最早提出和實現(xiàn),ES6 將其寫進了語言標準,統(tǒng)一了用法,原生提供了Promise對象。

? ???????????Promise的構造函數(shù)接收一個參數(shù),是函數(shù),并且傳入兩個參數(shù):resolve,reject,分別表示異步操作執(zhí)行成功后的回調(diào)函數(shù)和異步操作執(zhí)行失敗后的回調(diào)函數(shù)。其實這里用“成功”和“失敗”來描述并不準確,按照標準來講,resolve是將Promise的狀態(tài)置為fullfiled,reject是將Promise的狀態(tài)置為rejected。




GO

function ajax(method, url){

????????????return new Promise((resolve, reject) => {

????????????????var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');

????????????????if(method == 'GET') {

????????????????????xhr.open('GET', url, true);

????????????????????xhr.send(null);

????????????????????}else{

????????????????????????reject(new Error('請求相關錯誤'));

????????????????????}

????????????????xhr.onreadystatechange = function(){

????????????????????if(xhr.readyState == 4){ if(xhr.status == 200){

????????????????????????// console.log('--');

????????????????????????resolve(JSON.parse(xhr.responseText));

????????????????????}else{ reject(new Error('失敗'));

????????????????}

? ? ? ? ? ? ? }

????????????}

????????})

????}

????????????ajax('GET','http://10.0.157.247:8888/getUserList')

????????????????.then( (data) => { console.log(data); })

????????????????.catch((err) => { console.log(err); })

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • 特點 Promise能將回調(diào)分離出來,在異步操作執(zhí)行之后,用鏈式方法執(zhí)行回調(diào),雖然es5用封裝函數(shù)也能實現(xiàn),但是如...
    一二三kkxx閱讀 714評論 0 1
  • //本文內(nèi)容起初摘抄于 阮一峰 作者的譯文,用于記錄和學習,建議觀者移步于原文 概念: 所謂的Promise,...
    曾經(jīng)過往閱讀 1,318評論 0 7
  • 咳咳 一直都很喜歡使用原生的JavaScript,特別是不需要考慮兼容性的場景(雖然少得可憐)??上CMAScr...
    黃努努閱讀 8,760評論 2 3
  • 延遲存儲屬性是指當?shù)谝淮伪徽{(diào)用的時候才會計算其初始值的屬性。在屬性聲明前使用lazy來標示一個延遲存儲屬性。延遲屬...
    Taureau_2d81閱讀 882評論 0 0
  • 剛參加工作的時候,在csdn上寫過類似的文章,今天維護代碼,覺得還是有一點點價值的,特來分享一下,大家多拍磚。 準...
    KKKKaras閱讀 3,038評論 8 17

友情鏈接更多精彩內(nèi)容