构造函数内异步赋值类属性失效，求合规重构方案

问题根源 #

构造函数中直接调用异步方法getdata()，但构造函数无法等待异步操作完成。实例创建后，getdata里的OfficeClass.GetLocalData还未返回结果，导致static getProjects中立刻访问reqHeader.url时始终为空。

重构方案一：静态工厂方法异步创建实例 #

通过静态工厂方法确保实例返回前已完成异步数据加载，从根源解决时序问题：

class RequestHeaders {
  constructor() {
    this.url = "";
    this.oauthtoken = "";
    this.oauthverifier = "";
    this.loginType = "";
    this.basicLogin = "";
    this.isServiceDeskCustomer = "";
    this.isCookieLogin = "";
    this.cookie = "";
  }

  // 简化异步数据加载逻辑，去掉冗余的.then()
  async getdata() {
    const settings = await OfficeClass.GetLocalData("user-credentials");
    if (settings) {
      this.url = settings.url;
      this.oauthtoken = settings.oauthtoken;
      this.oauthverifier = settings.oauthsecret;
      this.loginType = settings.loginType;
      this.basicLogin = settings.basicLogin;
      this.isServiceDeskCustomer = settings.isServiceDeskCustomer;
      // 注意：原代码此处疑似笔误，建议确认是否应赋值为settings.isCookieLogin
      this.isCookieLogin = settings.isServiceDeskCustomer;
      this.cookie = settings.basicLogin;
    }
  }

  // 静态工厂方法：异步创建并完成初始化的实例
  static async create() {
    const instance = new RequestHeaders();
    await instance.getdata();
    return instance;
  }

  headers = (query) => {
    if (this.loginType === "basic") {
      return {
        isBasicLogin: "true",
        authentication: this.basicLogin,
        Pragma: "no-cache",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,PUT,POST,DELETE,PATCH,OPTIONS",
      };
    } else if (this.loginType === "customer") {
      return {
        iscookielogin: "true",
        cookiekey: this.basicLogin,
        Pragma: "no-cache",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,PUT,POST,DELETE,PATCH,OPTIONS",
      };
    } else {
      return {
        isBasicLogin: "false",
        token_access: this.oauthtoken,
        token_secret: this.oauthverifier,
        Pragma: "no-cache",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,PUT,POST,DELETE,PATCH,OPTIONS",
      };
    }
  };
}

// 修改getProjects为async方法，等待实例初始化完成
RequestHeaders.getProjects = async (ServerVersion) => {
  const reqHeader = await RequestHeaders.create();
  const header = reqHeader.headers();
  const headers = {
    ...header,
    url: reqHeader.url + UtilsJiraApi.getProjects(ServerVersion),
  };
  return axios.get(Utils.serverURL() + "get", { headers });
};

重构方案二：显式等待实例初始化 #

如果需要手动控制初始化时机，可让外部显式调用并等待getdata完成：

class RequestHeaders {
  constructor() {
    this.url = "";
    this.oauthtoken = "";
    this.oauthverifier = "";
    this.loginType = "";
    this.basicLogin = "";
    this.isServiceDeskCustomer = "";
    this.isCookieLogin = "";
    this.cookie = "";
  }

  async getdata() {
    const settings = await OfficeClass.GetLocalData("user-credentials");
    if (settings) {
      // 同上赋值逻辑
    }
  }

  headers = (query) => {
    // 同上逻辑
  };
}

RequestHeaders.getProjects = async (ServerVersion) => {
  const reqHeader = new RequestHeaders();
  await reqHeader.getdata(); // 显式等待异步初始化完成
  const header = reqHeader.headers();
  const headers = {
    ...header,
    url: reqHeader.url + UtilsJiraApi.getProjects(ServerVersion),
  };
  return axios.get(Utils.serverURL() + "get", { headers });
};

注意事项 #

1. 原代码中this.isCookieLogin = settings.isServiceDeskCustomer疑似笔误，建议确认是否应赋值为settings.isCookieLogin，避免逻辑错误。
2. 修改后的getProjects为async方法，调用它的地方需要用await或.then()处理返回的Promise。

内容的提问来源于stack exchange，提问作者Sora