typescript - 我如何索引到 TypeScript 中的对象类型？

Question

我的应用程序接收“消息”。我首先验证未知输入以确保它遵循预期的消息格式:

const isMessage = x => 
  typeof x === 'object' && 
  x !== null && 
  typeof x['data'] === 'string';

我想在 TypeScript 中输入这个。这是我拥有的:

type Message = { data: string };

const isMessage = (x: unknown): x is Message => 
  typeof x === 'object' && 
  x !== null && 
  typeof x['data'] === 'string';

但是，这无法进行类型检查，因为:

Element implicitly has an 'any' type because expression of type '"data"' can't be used to index type '{}'.
  Property 'data' does not exist on type '{}'.

在类型保护 typeof x === 'object' && x !== null 之后，TypeScript 给出类型 x : object。这似乎与 x : {} 相同。但是这种类型不允许我检查对象的任何属性。

而不是 x: object，我想我想要一个像 x: { [key: string |编号 |符号]:未知。但这不是 TypeScript 从类型保护 typeof x === 'object' 给我的类型。

我可以使用 as 将 x 转换为字典类型:

const isMessage = (x: unknown): x is Message => 
  typeof x === 'object' && 
  x !== null && 
  typeof (x as { [key: string | number | symbol]: unknown })['data'] === 'string';

这种类型检查，但它确实又长又笨重，而且我不确定 as 类型转换是否真的是类型安全的。

我读到了 in operator narrowing ，并基于此，我预计在 x 中添加 'data' 会起作用:

const isMessage = (x: unknown): x is Message => 
  typeof x === 'object' && 
  x !== null && 
  'data' in x &&
  typeof x['data'] === 'string';

但是，这没有区别； TypeScript 仍然提示我无法索引到 x，即使在 'data' in x 的位置也是如此。为什么这个 in 运算符不允许我索引到 x？

Answer 1

你应该可以这样做:

type Message = { data: string };

const isMessage = (x: unknown): x is Message => 
  typeof x === 'object' && 
  x !== null && 
  typeof (x as Message).data === 'string';

此技术显示在 TypeScript 的文档中:https://www.typescriptlang.org/docs/handbook/2/narrowing.html#using-type-predicates

---

由于 typeof 也是一个运行时 检查，as 断言不会删除任何类型安全性。

你可以这样想:在最后一行之前，我们已经检查过x是一个对象并且不是null。因此，x.data 不会在运行时失败，即使 x 是 {} 或 {bar: 'bar'} 或 {data: null}。我们只需要使用断言让编译器允许我们进行运行时 typeof 检查。