Question

我有以下TS接口

export interface Item {
  product: string | Product;
}

当我想通过一系列项目进行识别时，我必须消除这种类型。换句话说

items = Items[];
items.forEach(item => {
  item.product._id
})

不起作用，因为属性不适用于字符串。因此，我必须预先检查类型，即：

items = Items[];
items.forEach(item => {
  if (typeof item.product === 'object') item.product._id
})

我真的不喜欢它的样子。你是如何处理这种情况的？

Answer 1

应该有类型保护以缩小类型：

if (item.product && typeof item.product === 'object') item.product._id

或者：

if (item.product && typeof item.product !== 'string') item.product._id

如果接口建议item.product可能是字符串，则需要进行此项检查。

否则应该声明类型：

items.forEach(item => {
  (item.product as Product)._id
})

Answer 2

Javascript没有输入变量，所以我想你的问题只是关于你的IDE。

第一个也是最明显的解决方案是将变量声明为any。没有进一步的问题，但您没有自动完成功能。

第二个解决方案，不实用，是创建一个类型变量：

if (item instanceof Product) {
  _item: Product = item;
  // Now you have autocomplete on _item
} else if (typeof item === 'string') {
  _item: string = item;
  // Same here. 
}

这不实用，因为你必须写两次你的逻辑：一次是产品，一次是字符串。但是！它可能不实用，但它是详尽无遗的，因为你必须实现两种逻辑（它们肯定会有所不同，因为你不会像对象那样对待字符串，反之亦然）。

Answer 3

这可能听起来很奇怪，但第一个/最好的方法应该是“没有混合型字符串产品的类变量”。

您的具体用例是什么？为什么有些产品是字符串而有些是类？是否可以为字符串类创建实例？

如果出于某些原因这种情况不可能，你可以用instanceof检查正确的类型（不要检查typeof ==='object'，因为它不是很安全）

if (item instanceof Product) { // do logic }}

如何正确处理多种类型的TypeScript值

3 个答案: