Question

我正在尝试在JavaScript中扩展Request对象。我的用例是我想要包含更多方法并根据httpMethod修改URL。

我尝试过如下：

class ServiceRequest extends Request {
  constructor(config) {
    const url = config && config.url;
    const method = config && config.method;
    const body = config && (JSON.stringify(config.body) || {});
    const headers = (config && config.headers) || new Headers({
      'Content-Type': 'application/json; charset=UTF-8',
      Accept: 'application/json',
    });
    if (url && method) {
      const apiUrl = this.buildAPIPath(url, method);
    }
    super(apiUrl, {method,body,headers});
  }
  buildAPIPath (url, httpmethod) {// all the url modifications return modify url;}
}

现在它没有超级给出错误我无法调用它。我的问题是这个url是只读的，所以我不能先调用super。如果我先打超级，那么我就不能重新分配网址。

关于如何使其发挥作用的一些建议？

Answer 1

我正在尝试在JavaScript中扩展mapped.Engine is Empty对象。

绝对没有理由这样做 - 你不会覆盖它的任何方法。只需编写一个返回正常Request的正常函数：

Request

给出错误我在调用super
之前无法调用此类函数

是。在function buildAPIPath (url, httpmethod) { // all the url modifications return /* modified url */; } export function ServiceRequest(config) { const url = config && config.url; const method = config && config.method; const body = config && JSON.stringify(config.body || {}); const headers = (config && config.headers) || new Headers({ 'Content-Type': 'application/json; charset=UTF-8', Accept: 'application/json', }); const apiUrl = buildAPIPath(url, method); return new Request(apiUrl, {method,body,headers}); }调用之前，不存在任何实例，因此您无法在其上调用任何方法。真的没办法解决这个问题。但是，您的super方法无论如何都不使用实例，因此它根本不应该是一种方法。您可以使用buildAPIPath之外的普通函数声明，或静态方法（可以使用class或new.target.buildAPIPath(…)调用）。

Answer 2

在this之前无法访问

super类实例，因为ES6类是以这种方式设计的，并且没有解决方法。如果需要这样做，ES6类应该适用于没有此限制的常规构造函数。

情况并非如此，因为buildAPIPath不涉及类实例，所以它可以是静态方法：

class ServiceRequest extends Request {
  static buildAPIPath(url, httpmethod) {
    /* ... */   
  }

  constructor(config) {
    /* ... */
    if (url && method) {
      apiUrl = new.target.buildAPIPath(url, method);
    }
    super(apiUrl, {method,body,headers});
  }
}

Answer 3

由于Request API主要是只读的，更好的方法可能是在Request对象周围创建一个类包装器，而不是扩展它，如下所示：

class ServiceRequest {
  constructor(config) {
    const url = config && config.url;
    const method = config && config.method;
    const body = config && JSON.stringify(config.body || {}); // changed this as {} should also be stringified
    const headers = (config && config.headers) || new Headers({
      'Content-Type': 'application/json; charset=UTF-8',
      Accept: 'application/json',
    });
    let apiUrl = url; // apiUrl should be outside if statement, to not error out
    if (url && method) {
      apiUrl = this.buildAPIPath(url, method);
    }
    this.request = new Request(apiUrl, {method,body,headers});
  }
  buildAPIPath (url, httpmethod) {
    // all the url modifications return modify url;
  }
}

稍后将其与fetch一起使用，如下所示：

const {request} = new ServiceRequest({/*opts*/})
fetch(request);

在javascript类

3 个答案: