TypeScript中如何收窄变量访问的对象属性类型以排除undefined？

在TypeScript中，确实可以解决动态变量访问对象属性时无法收窄类型排除undefined的问题，先明确问题根源：

TypeScript的类型收窄依赖值的可预测性：

• 用let声明的变量（比如例子里的a）类型是string，TypeScript无法保证它后续不会被重新赋值，因此每次访问d[a]时，都无法确定对应的属性是否和之前检查的是同一个，自然没法收窄类型。
• 即便用const复制let变量（比如b = a），因为a本身是string类型，b的类型也会被推断为string，而非具体的字面量，所以同样无法触发类型收窄。
• 只有直接用字面量初始化的const变量（比如c），TypeScript能确定它的值永远不会变，因此可以安全地收窄类型。

下面是几种可行的解决方法：

1. 将变量类型锁定为字面量类型 #

如果变量的值不会改变，可以用as const断言把变量类型从string收窄为具体的字面量类型：

interface Dict {
  [k: string]: {
    prop?: number;
  };
}

const d: Dict = {};
let a = "item" as const; // 类型变为 "item" 字面量
const b = a; // 此时b的类型也是 "item"

if (d[a].prop) {
  d[a].prop++; // 正常通过类型检查
}

if (d[b].prop) {
  d[b].prop++; // 也能正常通过
}

2. 使用临时变量缓存属性值 #

先把要访问的属性值存到临时变量里，通过检查临时变量来完成类型收窄：

interface Dict {
  [k: string]: {
    prop?: number;
  };
}

const d: Dict = {};
let a = "item";

const targetProp = d[a].prop;
if (targetProp) {
  const updatedProp = targetProp + 1;
  d[a].prop = updatedProp; // 操作后赋值回原对象
}

临时变量是一次性读取的，TypeScript能确定它的类型在检查后不会变化，因此可以安全操作。

3. 自定义类型守卫函数 #

编写一个类型守卫函数，明确告诉TypeScript当条件满足时，对象的prop属性是已定义的：

interface Dict {
  [k: string]: {
    prop?: number;
  };
}

const d: Dict = {};
let a = "item";

// 类型守卫：确认对象的prop属性存在且为number
function hasValidProp(obj: { prop?: number }): obj is { prop: number } {
  return typeof obj.prop === "number";
}

if (hasValidProp(d[a])) {
  d[a].prop++; // 类型检查通过
}

这种方法更严谨，能避免空字符串、0等假值被误判的情况（比如原代码里if (d[a].prop)会把0当成假值，而类型守卫可以精确判断类型）。

4. 非空断言（谨慎使用） #

如果能100%确定属性值不会是undefined，可以用非空断言!强制告诉TypeScript排除undefined类型：

interface Dict {
  [k: string]: {
    prop?: number;
  };
}

const d: Dict = { item: { prop: 1 } };
let a = "item";

d[a].prop!++; // 强制跳过undefined检查

注意：这种方法会绕过TypeScript的类型检查，如果运行时prop实际是undefined，会直接抛出错误，仅在确定值存在时使用。

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