React/Typescript中useState定义对象时应使用什么类型替换any？

1. 优先使用明确的自定义接口/类型 #

如果清楚该状态对象的键名和对应值类型，直接定义专属类型，能获得完整的类型校验和智能提示：

// 先定义状态的结构类型
interface PageConfig {
  title: string;
  visible: boolean;
  count: number;
}
// 替换any为自定义类型，同时初始化值要匹配定义的结构
const [value, setValue] = React.useState<PageConfig>({
  title: '',
  visible: false,
  count: 0
});

2. 未知对象结构时用Record<string, unknown> #

如果暂时不确定对象的具体结构，仅需要限定为普通对象类型，相比any更安全：

// 表示键为字符串类型、值为未知类型的普通对象
const [value, setValue] = React.useState<Record<string, unknown>>({});

注意：使用该类型时，访问对象属性需要先做类型断言或类型 narrowing，避免无提示的类型错误。

3. 仅限定对象类型用object（不推荐） #

如果只需要校验值是对象，不需要对属性做任何检查，可以用object类型：

const [value, setValue] = React.useState<object>({});

该类型仅能排除非对象类型的赋值，无法对对象属性做任何类型校验，使用时访问任意属性都会触发TS报错，因此仅在极少数场景下使用。

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