Switch Case 正则表达式测试

Question

var path = location.pathname;
 switch(path){
  case (/\/memberlist/).test(path) :getCSS('url-22.css'); break;
  case (/\/register/).test(path):  getCSS('url-6.css');  break;
  case (/buy-credits/g).test(path): getCSS('url-7.css'); break;
  case (/\/?u(\d+)friends$/).test(path): getCSS('url-8.css'); break;
  case (/\/privmsg/).test(path): getCSS('url-9.css'); break;
  case (/\/?u(\d+)wall$/).test(path): getCSS('url-4.css'); break;
 }
  function getCSS(url,media){
       var a = document.createElement('link');
           a.href=url;
           a.media= media || 'screen';
           a.rel="stylesheet";
     return (document.getElementsByTagName('head')[0].appendChild(a));    
  }

以下是我的代码，但由于某些原因，它无法运行应该被执行的函数。为了测试，我们可以更改var path="/memberlist"，但它仍然无法运行。有人能解释一下为什么会出现这种情况吗？不太使用switch语句。

- EasyBB

---

你总是在比较中使用路径。所以让您输入的字符串与路径相同。如果要使用类似于子字符串的内容，请参见此处：https://dev59.com/0HE85IYBdhLWcg3wMQhm - chillworld

Answer 1

改变

switch(path){

至

switch(true){

正如您在评论中引用的帖子中所看到的。

- chillworld

---

是的，我之前看到过这个问题，但在anubhava解释后，我明白了为什么它没有返回任何内容，因为它所寻找的不是真或假。现在它已经可以工作了，谢谢。 - EasyBB

相关答案，其中包含一个示例：https://dev59.com/Jabja4cB1Zd3GeqPlL4M#47281232 - Jerry Jeremiah

Answer 2

没有任何一个发布的答案显示正确的方法来在switch case中使用RegExp模式，所以我想发布以下代码：

switch (myVar) {
   case 'case1':
      /...do work
      break
   case /[a-z]*/.test(myVar) && myVar:
      /...regex match, do work
      break
}

- Cory Robinson

---

这个很好地运作了。 我可以问一下AND是什么意思，为什么没有它就不能工作？ - JustAGuy

@gilfalko 需要使用 && myVar 是因为 switch 语句在寻找参数匹配的情况下，我们需要使用 && 来确保只有当正则表达式为真时才进行匹配。 - Cory Robinson

你可以像@chillworld的例子一样删除&&并将参数更改为“true”，它也会起作用。 - Cory Robinson

但是如果我们有一个匹配，regex.test()本身不会返回true\false吗？ - JustAGuy

这似乎是根据所提出的问题的正确答案。正是我在寻找的。 - MuffinTheMan

Answer 3

switch-case不是那样工作的。

regex.test()方法返回一个布尔值（true/false），你正在将其与输入字符串本身进行比较，这对于任何case语句都不会为真。

您需要将switch-case转换为多个if/else if/else块以执行您的逻辑。

- anubhava

---

哦，所以开关必须设置为true？ - EasyBB

对于您更新的答案，我只是将开关改为true，现在它完美地工作了。我将其从“if / else if / else”更改为最小化，使其不那么混乱。 - EasyBB

switch只有在需要匹配多个值时才有用，这里你将从regex.test()方法中得到true或false。 - anubhava

@anubhava 实际上它可以看到我在评论中设置的链接。他正在尝试进行子字符串切换，但他需要切换为true而不是路径。 - chillworld

是的，循环对于这种情况是可行的，尽管我正在为朋友编写此代码，但不想告诉他如何更新它，或者向他解释。谢谢大家。 - EasyBB

Answer 4

仅供记录，switch case可以重写为：

getCSS(
    /\/memberlist/).test(path)    && 'url-22.css' ||
    /\/register/).test(path)      && 'url-6.css'  ||
    /buy-credits/g).test(path)    && 'url-7.css'  ||
    /\/?u(\d+)friends$/)          && 'url-8.css'  ||
    /\/privmsg/).test(path)       && 'url-9.css'  ||
    /\/?u(\d+)wall$/).test(path)  && 'url-4.css'  || 
    'default'
);

或者使用辅助对象重写getCSS函数

var path2url = {
   css: [
                {re: /\/register/, css: 'url-22.css'},
                {re: /buy-credits/g, css: 'url-6.css'},
                {re: /\/?u(\d+)friends$/, css: 'url-8.css'},
                {re: /\/privmsg/, css: 'url-8.css'},
                {re: /\/?u(\d+)wall$/, css: 'url-4.css'}
        ],
   getURL: function(path) {
     var i = this.css.length;
     while (--i) {
       if (this.css[i].re.test(path)) {
         return this.css[i].css;
       }
     }
     return null; // or something default
   }
};

function getCSS(path,media){
  var a = document.createElement('link');
  a.href= path2url.getURL(path); // <=
  a.media= media || 'screen';
  a.rel="stylesheet";
  return (document.getElementsByTagName('head')[0].appendChild(a));    
}

- KooiInc

Answer 5

请看一下

switch(str){
    case (/(abc|xyz)/.test(str) ? str : false):
        // Do some stuff
        break;
    default:
        // Do default stuff         
}

- DebuggerCoder

---

为什么这个答案会被评为-1？ - DebuggerCoder

你有试过自己的代码吗？你的情况返回true或false，但你正在将布尔值与字符串匹配。你必须将switch（str）更改为switch（true）才能使其正常工作。此外，额外的bool检查是不必要的，因为test()已经返回true或false。 - Pandora