了解一些 Promises 代码和打字稿

Question

我有以下代码，由于我没有经常使用 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个参数，但是签名接收多了，怎么知道是哪些参数？按参数顺序？，不需要传递所有参数吗？

2. 什么是解决和拒绝？

3. 我知道 then 中的代码是在执行 Web 请求后执行的，但是在 then 中我根本看不到函数，我看到 data: { FormDigestValue: string }): void => 这是一个语法我不懂。

4. 什么是resolve(this.response as T); ?我来自 C# 和泛型，所以看起来它可以返回任何东西？

5. 最后，我可以拒绝任何东西吗？

拒绝（{ 消息：this.response['odata.error'].message.value, statusText：this.statusText， 状态：this.status });

Answer 1

您发布的代码很难看，根本不实用。这不是开始学习 Promise 的好地方。

非常好的起点是 MDN（Mozilla 开发网络）。它有关于 Javascript 主题的优秀文档，包括 Promise。

一些快速的答案：

1. request方法有2个强制参数，其余为可选参数，如headers: any = null。这意味着如果headers（any 类型）没有作为参数给出，它将默认为null。

2. 这两个函数都返回一个Promise 对象，它代表一个未来值或错误。 resolve(value) 用于表示Promise 成功变为值，reject(error) 用于表示出现问题。

3. 代码在请求之后执行，因为它在从request 返回的Promise 上调用.then(onValue, onError)。为处理Promise 的两种可能情况而传递的函数作为参数给出：

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

如果从request 返回的Promise 由resolve(data) 解决，则此函数将依次将自己的Promise 解析为data.FormDigestValue。

如果从request 返回的Promise 由reject(error) 设置，则此函数将依次拒绝其自己的Promise 与相同的error。

getRequestDigest 不是很好的代码。正如您将通过阅读 MDN 文档了解到的那样，Promise 对象可以被链接。 new Promise() 构造函数更难使用，在这种情况下不是必需的。它应该改为（在此处跳过打字稿）：

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

.then 将产生一个新的Promise，它派生自前一个（由component.request 返回）以创建相同的结果。

我是否提到要阅读MDN 上的主题？说真的，很棒的资源。