面试题：TypeScript 混合类型在复杂项目架构中的优化与实践

优化混合类型使用策略

类型别名与接口定义
- 使用类型别名或接口来明确混合类型的结构。例如，若有一个对象可能包含不同类型属性：

type User = {
  name: string;
  age: number;
  isAdmin?: boolean;
};

- 这样在函数参数、返回值或变量声明时直接使用`User`类型，提高可读性和可维护性。

2. 类型断言 - 当明确知道某个值的类型，但TypeScript无法自动推断时，使用类型断言。例如从document.getElementById获取元素：

const myElement = document.getElementById('my - element') as HTMLInputElement;
myElement.value = 'new value';

- 但要谨慎使用，防止类型错误。

3. 联合类型与交叉类型 - 联合类型：用于表示一个值可以是多种类型之一。例如，函数接受字符串或数字：

function printValue(value: string | number) {
  console.log(value);
}

- **交叉类型**：用于合并多个类型的特性。例如，一个对象既有`User`的属性，又有`Role`的属性：

type Role = {
  roleName: string;
};
type UserWithRole = User & Role;

使用类型保护
- 在函数中通过类型保护来缩小联合类型的范围。例如：

function printValue(value: string | number) {
  if (typeof value ==='string') {
    console.log(value.length);
  } else {
    console.log(value.toFixed(2));
  }
}

避免潜在问题

类型检查遗漏
- 在实际项目中，比如一个表单提交函数接收混合类型数据。要确保对所有可能类型进行充分的类型检查，不能遗漏。在提交前对数据按定义的类型进行验证。
隐式类型转换问题
- 避免隐式类型转换导致的错误。例如，在比较混合类型数据时，要注意==和===的区别。如'1' == 1为true，但'1' === 1为false。在实际处理用户输入数据时，明确类型转换规则，尽量使用显式转换。
文档说明
- 对于复杂的混合类型，添加详细的文档注释。在实际项目中，当团队协作开发时，清晰的文档能让其他开发者快速了解混合类型的结构和使用场景，避免误用。例如：

/**
 * 函数接收一个混合类型参数，可能是字符串表示的日期，也可能是Date对象
 * @param dateValue 日期值
 */
function formatDate(dateValue: string | Date) {
  //...
}

星途面试题库

面试题：TypeScript 混合类型在复杂项目架构中的优化与实践

知识考点

面试题答案

优化混合类型使用策略

避免潜在问题