Question

我有一个全局有几个常量的环境：

TOP = 1
TOP_RIGHT = 2
RIGHT = 3
BOTTOM_RIGHT = 4
BOTTOM = 5
BOTTOM_LEFT = 6
LEFT = 7
TOP_LEFT = 8

我很清楚，这8个常数不仅仅是任意常数，而且实际上是一组方向。因此，我希望它们属于DIRECTION类型，以便我可以做到这样的事情：

let test: DIRECTION = TOP_LEFT;

enum类型似乎是实现此目的最合乎逻辑的方式，但我遇到了以下问题：

我之前试图实现此行为，但有些困难。

src/main.ts(1,23): error TS2304: Cannot find name 'TOP_LEFT'.

打字稿文件：

main.ts：

let test: DIRECTION = TOP_LEFT;
console.log(test);

direction.d.ts：

declare enum DIRECTION {
    TOP = 1,
    TOP_RIGHT = 2,
    RIGHT = 3,
    BOTTOM_RIGHT = 4,
    BOTTOM = 5,
    BOTTOM_LEFT = 6,
    LEFT = 7,
    TOP_LEFT = 8,
}

忽略编译错误，运行“tsc”的JavaScript结果（a.k.a。已编译的代码）看起来它将访问预定义的全局属性：

let test = TOP_LEFT;
console.log(test);

如何以TypeScript友好的方式获得此类输出？

Answer 1

您认为枚举的使用错误。枚举在Javascript中的存在方式不同于例如c ++。当编译器编译你的枚举声明时，会在其位置创建一个新变量，并使用映射来检索键和值。

以下枚举......

enum Example {
    One,
    Two
}

...是以下Javascript对象的TypeScript等价物：

var Example;
(function (Example) {
    Example[Example["One"] = 0] = "One";
    Example[Example["Two"] = 1] = "Two";
})(Example || (Example = {}));

你看起来是一组映射到一个类型的常量。您可以在TypeScript中声明文字类型。例如declare type Direction = 1 | 2 | 3 ... | 8;。但是，当您重构代码或添加更多方向常量时，这并不是很有用。幸运的是，您可以使用typeof关键字来获取对象的值。您可以按照以下方式声明Directions类型：

const TOP = 1
const TOP_RIGHT = 2
const RIGHT = 3
const BOTTOM_RIGHT = 4
const BOTTOM = 5
const BOTTOM_LEFT = 6
const LEFT = 7
const TOP_LEFT = 8

declare type Direction =
    typeof TOP |
    typeof TOP_RIGHT |
    typeof RIGHT |
    typeof BOTTOM_RIGHT |
    typeof BOTTOM |
    typeof BOTTOM_LEFT |
    typeof LEFT |
    typeof TOP_LEFT;

const dir: Direction = TOP_LEFT; // or = 8

使用此类Direction声明的变量必须与该类型具有匹配值，例如在你的情况下1到8。

但是，我宁愿使用枚举而不是声明一堆全局变量。

Answer 2

您已宣布环境枚举：enums。它们通常用于为预先存在的类型提供类型信息 - 例如一个在导入的js库中定义的。如果你查看转换后的代码，你会发现它没有实际上发出了任何类型的查找。

声明枚举的正常方法是：

$("#submitAnchor").click(function(){
            $(".form1").submit();
            setTimeout(function() {
                window.location = 'your URL';
            }, 1000);
        });

会生成：

 enum DIRECTION {
    TOP = 1,
    TOP_RIGHT = 2,
    RIGHT = 3,
    BOTTOM_RIGHT = 4,
    BOTTOM = 5,
    BOTTOM_LEFT = 6,
    LEFT = 7,
    TOP_LEFT = 8,
}

然后你就这样使用它：

var DIRECTION;
(function (DIRECTION) {
    DIRECTION[DIRECTION["TOP"] = 1] = "TOP";
    DIRECTION[DIRECTION["TOP_RIGHT"] = 2] = "TOP_RIGHT";
    DIRECTION[DIRECTION["RIGHT"] = 3] = "RIGHT";
    DIRECTION[DIRECTION["BOTTOM_RIGHT"] = 4] = "BOTTOM_RIGHT";
    DIRECTION[DIRECTION["BOTTOM"] = 5] = "BOTTOM";
    DIRECTION[DIRECTION["BOTTOM_LEFT"] = 6] = "BOTTOM_LEFT";
    DIRECTION[DIRECTION["LEFT"] = 7] = "LEFT";
    DIRECTION[DIRECTION["TOP_LEFT"] = 8] = "TOP_LEFT";
})(DIRECTION || (DIRECTION = {}));

如何在TypeScript中声明将映射到环境定义的全局属性的枚举？

2 个答案: