javascript - 了解一些 Promises 代码和 typescript

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 中我根本看不到函数，我看到数据:{ FormDigestValue: string }): void => 这是一个语法我不懂。

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

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

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

Answer 1

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

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

一些快速的回答:

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

2. 这两个函数都返回一个 Promise 对象，它表示 future 的值或错误。 resolve(value) 用于表示 Promise 成功成为一个值，而 reject(error) 用于表示出现了错误.

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

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

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

如果 request 返回的 Promise 被 reject(error) 设置，则此函数将依次拒绝它自己的 Promise 具有相同的错误。

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

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

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

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