TypeScript如何解决未赋值对象无法进行空值检查的编译问题？

问题场景 #

将一段JavaScript代码转换为TypeScript后，对未赋值的account对象做空值检查时触发编译失败，TypeScript提示account未初始化。

原JavaScript代码：

const accounts = state.msalInstance.getAllAccounts();
let account;

if (accounts.length) {
  account = accounts[0];
} else {
  await state.msalInstance
    .handleRedirectPromise()
    .then(redirectResponse => {
      if (redirectResponse !== null) {
        account = redirectResponse.account;
      } else {
        state.msalInstance.loginRedirect();
      }
    })
    .catch(error => {
      console.error(`Error during authentication: ${error}`);
    });
}

if (account) {}

转换后的TypeScript代码编译报错：

const accounts = state.msalInstance.getAllAccounts();
let account: object;

if (accounts.length) {
  account = accounts[0];
} else {
  await state.msalInstance
    .handleRedirectPromise()
    .then((redirectResponse: {
      account: object;
    }) => {
      if (redirectResponse !== null) {
        account = redirectResponse.account;
      } else {
        state.msalInstance.loginRedirect();
      }
    })
    .catch((error: {
      name: string;
    }) => {
      console.error(`Error during authentication: ${error}`);
    });
}

if (account) {
  // 编译失败，提示account未赋值
}

核心原因 #

TypeScript的严格空值检查机制要求变量在使用前必须明确赋值。当前代码存在两种TypeScript无法识别的未赋值场景：

• else分支中，handleRedirectPromise返回null时仅执行页面跳转，但TypeScript无法感知页面跳转会终止后续代码，仍判定account可能未赋值。
• catch分支捕获错误时，account未被赋值。

修改方案 #

1. 声明可空类型并初始化 #

将account的类型声明为包含空值的联合类型，并赋予初始值，让TypeScript明确变量的初始状态：

let account: object | null | undefined = undefined;

2. 优化异步逻辑（推荐） #

用async/await替代链式.then()调用，让逻辑更直观，同时帮助TypeScript更好地分析变量赋值路径：

const accounts = state.msalInstance.getAllAccounts();
let account: object | null | undefined = undefined;

if (accounts.length) {
  account = accounts[0];
} else {
  try {
    const redirectResponse = await state.msalInstance.handleRedirectPromise();
    if (redirectResponse !== null) {
      account = redirectResponse.account;
    } else {
      // 页面跳转后后续代码不会执行，添加return终止逻辑
      state.msalInstance.loginRedirect();
      return;
    }
  } catch (error) {
    console.error(`Error during authentication: ${error}`);
    // 错误场景按需处理，比如赋值null
    account = null;
  }
}

if (account) {
  // 此处可正常访问account
}

3. 类型断言（临时应急，不推荐） #

如果业务上能确保account在使用前一定被赋值，可通过类型断言跳过检查，但会绕过TypeScript的类型安全校验：

if (account as object) {
  // 逻辑代码
}

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