如何检查函数中参数的实例？答案

【问题标题】：How to check instance of parameters in function?如何检查函数中参数的实例？
【发布时间】：2021-08-25 17:41:27
【问题描述】：

我要不同的界面

interface Vehicle {
// data about vehicle
}

interface Package {
// data about package
}

我有一个组件，它的 props 可以接收其中任何一个（将来可能会更多），所以我这样创建了道具界面：

interface Props<T> {
  modalVisible: boolean,
  selectableData: T[],
  currentlySelectedIndex: number,
  onSelect: (selection: T) => void,
  onBackPressed: () => void
}

在我的组件中，我有一个 FlatList 接收 selectableData 和一个 renderItem 函数，如下所示：

   <FlatList
      data={selectableData}
      renderItem={renderItem}
      style={{ maxHeight: 251 }}
      ItemSeparatorComponent={() => <FlatListItemSeparator separatorStyle= 
      {styles.itemSeparator} />}
      keyExtractor={(item, index) => index.toString()} />

  const renderItem: ListRenderItem<Vehicle | Package> = ({ item }) => (
    <ModalSelectionItem
      topText={ item instance Vehicle ? 'a' : 'b'}
    />
  );

我想根据传递的类型在FlatList 中呈现不同的文本，如何检查我的类型？我尝试同时使用 instanceof 和 typeof 但它们似乎都不起作用

【问题讨论】：

您不能，因为该类型信息未绑定到对象。如果要检查特定实例（使用instanceof/typeof），则必须使用类并创建该类的实例。您可以将类型字段添加到接口结构并使用该字段来确定类型

标签： typescript react-native

【解决方案1】：

Typescript 的工作方式是在编译时检查您的代码，在编译代码后，它只是普通的 javascript，因此 Interface 在运行时不存在。有两种方法可以做到。

使用类，然后您可以使用instanceof 运算符来检查您正在使用哪个类。
更简单，在您的对象（接口）上有一个type（string 或enum）属性并检查它。

【讨论】：

添加了使用枚举来防止编辑中的魔术字符串的可能性。枚举将被转译为普通对象，并在运行时使用 javascript 继续工作
如果字符串是预先确定的，则它们不必是魔术。 type: 'a' | 'b'| 'c '。现在只允许这三个值。