如何在打字稿中使用枚举作为索引键类型? [英] How to use enum as index key type in typescript?

问题描述

考虑以下示例.

enum DialogType {
    Options,
    Help
}

class Dialog { 
    test() : string {
        return "";
    }
}

class Greeter {

    openDialogs: { [key in DialogType]: Dialog | undefined } = {
        0: undefined,
        1: undefined
    };

    getDialog(t: DialogType) {
        return this.openDialogs[t];
    }
}

const greeter = new Greeter();
const d = greeter.getDialog(DialogType.Help);
if (d) document.write(d.test());

也在操场上

它有 3 个问题:

1. 为什么我不能在初始化器文字中省略属性，即使我将属性声明为 '|未定义'
2. 为什么我不能使用DialogType.Options"作为类型键，而必须使用硬编码的数字?
3. 为什么我必须使用 'key in DialogType' 而不是 'key: DialogType'?(或者我可以吗?)

推荐答案

1. |undefined 没有使属性可选，只是意味着它可以是undefined，有一个建议使|undefined> 成员可选，但目前尚未实现.您需要在 ] 之后使用 ? 使所有属性可选

1. |undefined does not make a property optional, just means it can be undefined, there is a proposal to make |undefined members optional but currently it's not implemented. You need to use ? after ] to make all properties optional

{ [key in DialogType]?: Dialog }

您可以使用对话框枚举值作为键，但它们需要计算属性:

You can use the dialog enum values as keys, but they need to be computed properties:

let openDialogs: { [key in DialogType]?: Dialog } = {
    [DialogType.Options]: undefined,
};

{ [key: number or string]: Dialog } 是一个索引签名.索引签名仅限于 number 或 string 作为键类型(甚至两者的联合都不起作用).因此，如果您使用索引签名，您可以通过任何 number 或 string 进行索引(我们不能仅限于 DialogType 键).您在此处使用的概念称为映射类型.映射类型基本上基于键的联合(在本例中为 DialogType 枚举的成员)和一组映射规则生成新类型.我们上面创建的类型基本上等价于:

{ [key: number or string]: Dialog } is an index signature. Index signatures are restricted to only number or string as the key type (not even a union of the two will work). So if you use an index signature you can index by any number or string (we can't restrict to only DialogType keys). The concept you are using here is called mapped types. Mapped types basically generate a new type based on a union of keys (in this case the members of DialogType enum) and a set of mapping rules. The type we created above is basically equivalent to:

let o: { [DialogType.Help]?: Dialog; [DialogType.Options]?: Dialog; }

这篇关于如何在打字稿中使用枚举作为索引键类型?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！