如何为特定类型元素使用唯一数组？并实现可扩展的多类型导航实体统一存储方案

这个问题的核心痛点是用联合类型维护可扩展的实体集合，每次新增类型都要修改多处代码。解决思路是通过提取公共接口来统一所有可导航实体的类型约束，让导航逻辑只依赖公共属性，同时保留实体的扩展性。

步骤1：定义公共导航实体接口 #

首先，把所有实体共有的id和name字段抽成一个基础接口——因为题目明确所有类型必须包含这两个字段用于导航展示。考虑到不同实体的id可能是字符串或数字，我们可以把id的类型设为string | number：

// 定义所有可导航实体必须实现的公共接口
interface NavigableEntity {
  id: string | number;
  name: string;
}

步骤2：让所有实体实现该接口 #

接下来，让你现有的User、Group、Experience（注：你原代码里的Expirience应该是拼写错误，建议修正为Experience），以及未来要新增的Car等实体，都继承这个公共接口：

// 现有实体类型
interface User extends NavigableEntity {
  // User特有的字段，保留你原有的定义
}

interface Group extends NavigableEntity {
  blocked: boolean; // Group特有的字段
}

interface Experience extends NavigableEntity {
  years: number; // Experience特有的字段
}

// 未来新增的实体，比如Car
interface Car extends NavigableEntity {
  // Car特有的字段，可按需添加其他属性
}

步骤3：重构导航相关代码 #

现在把原来的联合类型替换成公共接口类型，这样导航的变量和方法就不需要关心具体是哪种实体，只要符合NavigableEntity即可：

// 导航集合只需要约束为公共接口类型
public navigation: NavigableEntity[];

// 添加实体的方法，接收任意符合接口的实体数组
add(entities: NavigableEntity[]) {
  // 你的实现逻辑，比如合并到navigation中
  this.navigation.push(...entities);
}

// 移除实体的方法，同样接收公共接口类型的数组
remove(entities: NavigableEntity[]) {
  // 你的实现逻辑，比如过滤掉要移除的实体
  this.navigation = this.navigation.filter(item => 
    !entities.some(removeItem => removeItem.id === item.id)
  );
}

额外：处理实体特有属性（可选） #

如果在某些场景下需要处理实体的特有属性（比如判断Group是否被封禁），可以用类型守卫（Type Guards）来区分具体类型：

// 自定义类型守卫，判断是否为Group类型
function isGroup(entity: NavigableEntity): entity is Group {
  return 'blocked' in entity;
}

// 使用示例：遍历导航实体时处理Group的特有属性
this.navigation.forEach(entity => {
  console.log(`导航项：${entity.name}`);
  if (isGroup(entity)) {
    console.log(`该分组是否被封禁：${entity.blocked}`);
  }
});

方案优势 #

• 极强的扩展性：新增任何实体（比如Car、Product等），只要实现NavigableEntity接口，就可以直接接入导航功能，无需修改原有导航代码。
• 类型安全：TS会自动校验所有接入导航的实体是否包含id和name字段，避免遗漏必要属性。
• 代码简洁：导航逻辑只关注公共属性，不用维护冗长的联合类型。

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