如何使用 TypeScript 在接口中定义对象的命名数组？

Posted 2023-03-08

【中文标题】如何使用 TypeScript 在接口中定义对象的命名数组？

【英文标题】：How to define a named array of objects in an interface with TypeScript?

【发布时间】：2017-08-17 01:07:39

【问题描述】：

如何在 TypeScript 接口中定义 restaurants 属性？

let test = 
  user_id: 5,
  restaurants: [
    
      restaurant_id: 5,
      restaurant_rank: 5
    ,
    
      restaurant_id: 6,
      restaurant_rank: 6
    
  ],
  timestamp: 'test'
;

注意

我查看了以下问题，但没有一个能解决我的问题：

How can I define an interface for an array of objects with Typescript?

How can I define an array of objects in typescript?

【参考方案1】：

查看this 和this 的答案，我得出以下结论：

 interface InterfaceName 
  user_id: number,
  restaurants:  [index: number]:  restaurant_details: Object, restaurant_rank: number  ,
  timestamp: Date

但是，我发现它没有被检测为数组，因此更简单的解决方案是：

interface InterfaceName 
  user_id: number,
  restaurants:  restaurant_details: Object, restaurant_rank: number [],
  timestamp: Date

这样做将允许 TypeScript 编译器正确地将 InterfaceName.restaurants 视为 array。

【讨论】：

这对我来说效果很好。

【参考方案2】：

我会这样写：

interface IRestaurant 
    restaurant_id: number;
    restaurant_rank: number;
    restaurant_details?: any;


interface IThing 
    user_id: number;
    timestamp: string;
    restaurants: Array<IRestaurant>;


const test: IThing = 
    user_id: 5,
    restaurants: [
        
            restaurant_id: 5,
            restaurant_rank: 5
        ,
        
            restaurant_id: 6,
            restaurant_rank: 6
        
    ],
    timestamp: 'test'
;

还有其他几种方法可以做数组：

interface IThing 
    user_id: number;
    timestamp: string;
    restaurants: IRestaurant[];


interface IThing 
    user_id: number;
    timestamp: string;
    restaurants: Array<restaurant_id: number, restaurant_rank: number>;

我在您的回复中注意到您是restaurant_details: Object。您应该这样做 restaurant_details: any 因为 Object 比任何限制都更严格。见https://***.com/a/18961904/2592233

我还在restaurant_details 之后添加了一个问号，告诉编译器这是可选的，因为您在第一个示例中没有。

【讨论】：

所以如果restaurants 数组可以同时包含IRestaurant 和IHotel 条目，那么只有第一种方法可以工作，通过Array<IRestaurant | IHotel> 对吗？

我认为这应该可行，但我会使用新语法并执行[IRestaurant | IHotel][]