循环使用枚举,TypeScript和JQuery

时间:2015-06-04 20:46:12

标签: jquery enums typescript ienumerable enumeration

您好我试图使用TypeScript和JQuery开发一个直接的todo应用程序。我有一个列出任务类型的枚举:

export enum TaskType { FrontEnd, BackEnd, Designer };

然而,使用jquery.each或for循环遍历emum,我得到以下结果,(值然后索引):

        FrontEnd, BackEnd, Designer, 0, 1, 2

以下是我通过枚举循环的代码:

        constructor(e?: Object) {             

            var template = this.FormTemplate;

            $(e).append(template);

            var sel = template.find('select');

            /*$.each(TaskType, function (index, el) {
                sel.append("<option value='" + index + "'>" + el + "</option>");
            });*/

            for(var i=0; i < (typeof TaskType).length; i++){
                sel.append("<option value='" + TaskType[i] + "'>" + TaskType[i] + "</option>");
            }

        }

有人可以告诉我为什么会这样吗?

1 个答案:

答案 0 :(得分:20)

编译为plain JS时,

TypeScript枚举包含符号名称和数值作为属性,这解释了当您尝试枚举对象属性时获得FrontEnd, BackEnd, Designer, 0, 1, 2的原因。据我所知,没有后编译方式只枚举符号名称。你可以枚举所有这些并跳过任何数字。

this article开始,您可以准确地看到TypeScript枚举如何编译成JS。

如果你有这个TypeScript:

//TypeScript declaration:
enum StandardEnum {FirstItem, SecondItem, ThirdItem};

它汇编到这个Javscript:

//Compiled javascript:
var StandardEnum;
(function (StandardEnum) {
    StandardEnum[StandardEnum["FirstItem"] = 0] = "FirstItem";
    StandardEnum[StandardEnum["SecondItem"] = 1] = "SecondItem";
    StandardEnum[StandardEnum["ThirdItem"] = 2] = "ThirdItem";
})(StandardEnum || (StandardEnum = {}));
;

基本上是这个结果:

var StandardEnum = {
    "FirstItem": 0,
    "SecondItem": 1,
    "ThirdItem": 2,
    "0": "FirstItem",
    "1": "SecondItem",
    "2": "ThirdItem"
};

因此,除非您明确忽略数字属性,否则无法枚举枚举名称。

你可以这样做:

 for (var item in StandardEnum) {
     if (StandardEnum.hasOwnProperty(item) && !/^\d+$/.test(item)) {
         console.log(item);
     }
 }

工作演示:http://jsfiddle.net/jfriend00/65cfg88u/

仅供参考,如果您真正想要的是:

var StandardEnum = {
    "FirstItem": 0,
    "SecondItem": 1,
    "ThirdItem": 2
};

然后,也许你不应该使用枚举,只需使用这个标准的JS声明。然后,您可以使用Object.keys(StandardEnum)获取属性。