如何声明字典的接口？答案

【问题标题】：How to declare an interface for dictionary?如何声明字典的接口？
【发布时间】：2016-12-24 22:47:36
【问题描述】：

我想为我喜欢的插件添加定义，我想知道如何定义类型以允许这样做而不使用任何类型。

我会这样使用属性：

    views: {
        'list.view1': {
          dropPagingCap: 20,
          list_infiniteScroll: true,
          list_selectable: 'multi'
        },
        'list.view2': {
          dataSource: function(options, callback){ ... },
          dropPagingCap: 30,
          list_selectable: true
        }
    }

这个我试过了，但是库除了对象{}，不是数组[]

interface IFuelUxRepeaterViews {
    [index: string]: IFuelUxRepeaterParametersBase | IFuelUxRepeaterListParameter | IFuelUxRepeaterTumbnailParameter | IFuelUxRepeaterAllParameter;
}

我不知道如何命名这种 JavaScript 声明类型。

【问题讨论】：

这是一本字典或地图。请参阅stackoverflow.com/q/15877362/746347、stackoverflow.com/q/30019542/746347。你的定义应该有效。
将视图属性定义为views: IFuelUxRepeaterViews。

标签： typescript

【解决方案1】：

从您的代码示例看来，您的 views 可以使用以下接口表示：

interface IFuelUxRepeaterViews {
    [index: string]: {
        dropPagingCap: number;
        dataSource?: (options: any, cb: () => void) => void;
        list_infiniteScroll?: boolean;
        list_selectable?: string | boolean;   
    }
}

【讨论】：

坦克，就像我用过的一样，问题是有多种可能的类型，我已经用所有参数替换了它。
也可以是通用的`interface IFuelUxRepeaterViews { [index: string] : T }

【解决方案2】：

interface IFuelUxRepeaterParametersBase {
    dropPagingCap: number,
    list_selectable: boolean | string
}

interface IFuelUxRepeaterTumbnailParameter extends IFuelUxRepeaterParametersBase {
    list_infiniteScroll: boolean,
}

interface IFuelUxRepeaterListParameter extends IFuelUxRepeaterParametersBase {
    dataSource: (x: any, y: any) => any,
}

interface IFuelUxRepeaterViews {
    [index: string]: IFuelUxRepeaterParametersBase | IFuelUxRepeaterListParameter | IFuelUxRepeaterTumbnailParameter ;
}


let views: IFuelUxRepeaterViews = {
    'list.view1': {
        dropPagingCap: 20,
        list_infiniteScroll: true,
        list_selectable: 'multi'
    },
    'list.view2': {
        dataSource: (options, callback) => { },
        dropPagingCap: 30,
        list_selectable: true
    }
}

【讨论】：