2016-06-01 3 views
0

を解決しません:期待通りの約束は、私はそうplsは次のシナリオで私を啓発約束の世界に新たなんだ

function promiseDemo(fetch1,fetch2){ 
     return Promise.all([fetch1,fetch2]).then(function(values){ 
     return values[0]+values[1]; 
     }); 
    } 

    promiseDemo(ajax('sample1.html'),ajax('sample2.html')).then(function(sum){ 
    console.log(sum); 
    },function(){ 
     console.log('Whoopsie!!!!!'); 
    }); 


function ajax(file){ 
    var httpRequest=new XMLHttpRequest(); 
    httpRequest.open('GET',file,true); 
    httpRequest.onreadystatechange=function(){ 
    if(httpRequest.readyState == 4){ 
     if(httpRequest.status == 200){ 
      console.log('success'); 
      console.log(httpRequest.responseText); 
      return Promise.resolve(httpRequest.responseText); 
     }else{ 
     console.log('unexpected 400 error'); 
     return 0; 
    } 
    } 
} 
httpRequest.send(); 
} 

上記のコードは2つのファイルSAMPLE1とSAMPLE2からサンプルHTMLを取り、にテキストを追加reponseTextが期待どおりであっても、両方ともretreived.but im gettting values [0]とvalues [1]は未定義です。問題は何ですか?何か提案は歓迎です!

答えて

3

httpRequest.onreadystatechange関数のどこにでもreturnを使用すると、ではなくonreadystatechangeイベント自体から値が返されません。

あなたが約束して、コールバックのコードをラップする必要があるケースでは、あなたがPromise constructorを使用する必要があります。

function ajax(file) { 
    return new Promise((resolve, reject) => { 
      var httpRequest = new XMLHttpRequest(); 
      httpRequest.open('GET', file, true); 
      httpRequest.onreadystatechange = function() { 
       if (httpRequest.readyState == 4) { 
        if (httpRequest.status == 200) { 
         console.log('success'); 
         console.log(httpRequest.responseText); 
         resolve(httpRequest.responseText); 
        } else { 
         console.log('unexpected 400 error'); 
         reject(0); 
        } 
       } 
      } 
      httpRequest.send(); 
    }); 
} 

ただ、参考のために、すでにあなたが探しているものを実現しfetchと呼ばれる新しい方法があります。

promiseDemo(fetch('sample1.html'),fetch('sample2.html')).then(function(sum){ 
    console.log(sum); 
    },function(){ 
     console.log('Whoopsie!!!!!'); 
    }); 

ブラウザ用ポリフィルがGitHubで提供されています:あなたはとして使用することができます。

+1

何が失敗した!!!!!あなたは正しいです!あなたに感謝します。 –

+0

'fetch'の言葉の功績。 – hazardous

0

私はあなたのajax関数が約束を返さないと思うので、promiseDemoは解決するための約束の値を得ていません。何がpromiseDemo関数に渡されるのか調べてみてください。

これが問題であれば、すぐに返され、http要求コールバック関数で解決されたajax関数で新しい約束事を作成することで修正できます。

+0

私は...これはあなたのために働くべきだと思うし、それが解決されたと言うが、それはPromise.allのに来るとき、それがフェッチされます定義されていない私はなぜ知っていない?ところでウルの応答のためのおかげで: –

0

ajax関数は、onreadystatuschange関数によって解決/拒否されるべきPromiseではなく、undefinedを返します。私はすでにリターンテキストのPromise.resolve上にconsole.logで確認

function ajax(file){ 
    return new Promise(function (resolve, reject) { 
     var httpRequest=new XMLHttpRequest(); 

     httpRequest.open('GET', file, true); 

     httpRequest.onreadystatechange = function(){ 
      if(httpRequest.readyState == 4){ 
       if(httpRequest.status == 200){ 
        console.log('success'); 
        console.log(httpRequest.responseText); 
        resolve(httpRequest.responseText); 
       } 
       else { 
        reject({status: httpRequest.status}); 
        return 0; 
       } 
      } 

     } 

     httpRequest.send(); 
    } 
} 
関連する問題