2016-12-14 40 views
1

我有以下代碼,因爲我沒有與Promises一起工作了很多,然後我試圖理解,這個問題更多的是一個簡單的方法來理解代碼而不是一個特定的問題:瞭解一些Promises代碼和打字稿

private getRequestDigest(siteUrl: string): Promise<string> { 
     const component: Reactwithmsgraphandsharepoint = this; 
     return new Promise<string>((resolve, reject): void => { 
      component.request(`${siteUrl}/_api/contextinfo`, 'POST').then((data: { FormDigestValue: string }): void => { 
      resolve(data.FormDigestValue); 
      }, (error: any): void => { 
      reject(error); 
      }); 
     }); 
     } 


private request<T>(url: string, method: string = 'GET', headers: any = null, data: any = null): Promise<T> { 
    return new Promise<T>((resolve, reject): void => { 
     const xhr: XMLHttpRequest = new XMLHttpRequest(); 
     xhr.onreadystatechange = function(): void { 
     if (this.readyState === 4) { 
      if (this.status === 200) { 
      resolve(this.response as T); 
      } 
      else if (this.status >= 400) { 
      reject({ 
       message: this.response['odata.error'].message.value, 
       statusText: this.statusText, 
       status: this.status 
      }); 
      } 
     } 
     }; 

     xhr.open(method, url, true); 
     if (headers === null) { 
     xhr.setRequestHeader('Accept', 'application/json;odata=nometadata'); 
     } 
     else { 
     for (var header in headers) { 
      if (headers.hasOwnProperty(header)) { 
      xhr.setRequestHeader(header, headers[header]); 
      } 
     } 
     } 
     xhr.responseType = 'json'; 
     xhr.send(data); 
    }); 
    } 
  1. 在GET請求方法,請求方法執行,但有兩個參數,但是簽名得到更多的,它是如何知道哪些參數?通過參數順序嗎?,它不需要所有參數傳遞?

  2. 什麼是解析和拒絕?我知道,然後執行Web請求後執行,然後在我沒有看到一個函數,我看到的數據:{FormDigestValue:字符串}):void =>這是一個語法我不明白。

  3. 什麼是解析(this.response as T); ?我來自C#和泛型,看起來它可以返回任何東西?

  4. 最後,我可以把任何東西放在拒絕?

拒絕({ 消息:this.response [ 'odata.error'] message.value, 狀態文本:this.statusText, 狀態:this.status });

+0

1 - 參數方法,標題和數據具有默認值,所以如果您不提供它們,則使用默認值。 2 - 解決,拒絕是你用來解決或拒絕承諾的回調函數,3 - =>是一個箭頭函數,4 - 解析是一個Promise概念,5 - 是的,你可以拒絕任何你喜歡的東西 –

+1

避免[ 'getRequestDigest'中的'Promise' constructor antipattern](http://stackoverflow.com/q/23803743/1048572?What-is-the-promise-construction-antipattern-and-how-to-avoid-it)! – Bergi

回答

3

您發佈的代碼在眼睛上很難看,而且根本不實用。這不是一個開始學習承諾的好地方。

A 非常好開始的地方是MDN(Mozilla開發者網絡)。它有關於Javascript主題的出色文檔,包括Promise

一些快速的答案:

  1. request方法需要2個強制參數,其餘是可選的,如headers: any = null。這意味着如果headers(類型any)沒有作爲參數給出,它將默認爲null

  2. 這兩個函數都會返回一個Promise對象,該對象表示未來值或錯誤。 resolve(value)用於表示Promise成功成爲值,reject(error)用於指示出現問題。

  3. 該代碼在請求後執行,因爲它調用.then(onValue, onError)對從request返回的Promise。經過處理的Promise 2個可能的情況下,該功能被作爲參數:

    (data: { FormDigestValue: string }): void => { resolve(data.FormDigestValue) } 
    (error: any): void => { reject(error) } 
    

如果從request返回Promiseresolve(data)解決,此功能將依次解決其自身Promisedata.FormDigestValue

如果從requestPromise返回由reject(error) setteled,該功能將反過來拒絕了自己Promise具有相同error

getRequestDigest代碼不是很好。正如您通過閱讀MDN文檔所學,Promise對象可以被鏈接。構造函數new Promise()很難使用,在這種情況下不需要。它應該閱讀,而不是像(這裏跳過打字稿):

return component.request(url, method) 
    .then(data => data.FormDigestValue) 

.then將產生一個新的Promise,從以前的一個(由component.request返回)衍生創建相同的結果。

我有沒有提到閱讀MDN這個話題?真的,很好的資源。

+0

'request'只要我可以看見** **一個**強制性參數 –