0

我有一些看起来像这样的代码：

TheClass = TheAjaxIndicator.prop('class');

if (TheClass.indexOf('Blue') > 0) { TheHTML = TheHTMLBlue; }
if (TheClass.indexOf('White') > 0) { TheHTML = TheHTMLWhite; }
if (TheClass.indexOf('Green') > 0) { TheHTML = TheHTMLGreen; }
if (TheClass.indexOf('Brown') > 0) { TheHTML = TheHTMLBrown; }

我怎样才能避免所有这些if陈述？

谢谢。

4

3 回答 3

1

示例如何使用正则表达式将代码写得更短（但不一定更高效）：

var html = {
   'Blue': TheHTMLBlue,
   'White': TheHTMLWhite,
   // ...
};

var match = TheClass.match(/Blue|White|Green|Brown/);
// also possible:
// var match = TheClass.match(RegExp(Object.keys(html).join('|'));
if (match) {
    TheHTML = html[match[0]];
}
于 2013-01-24T02:34:22.947 回答
0

我将类名和值放入映射中，并迭代映射以寻找匹配项。 这里（jsfiddle）是一个如何做到这一点的例子。

var classToHtmlMap = {
    'Blue': TheHTMLBlue,
    'White': TheHTMLWhite,
    'Green': TheHTMLGreen,
    'Brown': TheHTMLBrown
}

var TheHTML;
var TheAjaxIndicator = $("#TheAjaxIndicator");
$.each(classToHtmlMap, function(key, value) {
    if(TheAjaxIndicator.hasClass(key)) {
        TheHTML = value;
            return false;
    }
});

顺便说一下，这使用了jQuery，但是方法是一样的，不管你怎么做。

于 2013-01-24T02:35:23.470 回答
-1

我建议您遵循使用局部变量pascalCase而不是TitleCase. 我跑题了。

在if您的代码中包含语句根本不会对性能产生负面影响 - 这是 2013 年，我们有 JIT 脚本引擎。您的代码也非常可读 - 我认为没有理由更改它（除了命名约定）。但是您可以使用switch语句，但前提是class属性是单个值：

switch( theAjaxIndicator.prop('class') ) {
    case "Blue" : theHTML = theHTMLBlue;  break;
    case "White": theHTML = theHTMLWhite; break;
    case "Green": theHTML = theHTMLGreen; break;
    case "Brown": theHTML = theHTMLBrown; break;
}

如果您想找点乐子，并且想迷惑任何试图阅读您的代码的人，您可以创造性地使用eval，如下所示：

eval('theHTML = theHTML' + theAjaxIndicator.prop('class') + ';');

但是这段代码会更慢，因为它会强制重新编译脚本。我不知道 JIT 在这种情况下是如何工作的。

于 2013-01-24T02:15:27.370 回答