怎么把“ camelCase”转换成“ Camel Case”?


174

我一直在尝试获取JavaScript regex命令以将类似内容"thisString"转换为,"This String"但是我得到的最接近的替换字母是,导致类似"Thi String"或的内容"This tring"。有任何想法吗?

为了弄清楚我可以处理大写字母的简单性,我对RegEx的了解不那么强,而拆分"somethingLikeThis""something Like This"麻烦的地方。



6
这是如何重复的。要做的只是将字符串中的第一个字符大写,没有什么比我想做的要大。
巫师做到了2010年

嗯,这不是对这个问题的重复,但是结果可能是相同的。还是那不是您想做的?详细说明吗?
2010年

对于正则表达式练习,我建议RegExr或Expresso进行测试,然后查看SO上的所有正则表达式问题并尝试回答它们。正则表达式不是世界上最简单的东西,但是请记住,如果您的正则表达式令人困惑,则将其拆分并分段工作。
josh.trow 2010年

Answers:


399
"thisStringIsGood"
    // insert a space before all caps
    .replace(/([A-Z])/g, ' $1')
    // uppercase the first character
    .replace(/^./, function(str){ return str.toUpperCase(); })

显示

This String Is Good


1
好男人,把它分开。只要记住Bobince的建议是:stackoverflow.com/questions/1732348/...
josh.trow

您确定这与IE兼容吗?刚刚在IETester7中尝试过并出现错误。
Strongriley

3
还添加:如果您想保留所有大写字母的首字母缩写,则可以将第一个正则表达式更改为“ /([AZ] [az])/”
jackfrster

2
“ This”->“ This”(不需要的前缀空间)。也许将其更改为:str.slice(0,1).toUpperCase()+ str.slice(1).replace(/([AZ])/ g,'$ 1')
Mark Vayngrib

1
@ColdCerberus您可以使用:str.replace(/((?<!^)[A-Z](?![A-Z]))(?=\S)/g, ' $1').replace(/^./, s => s.toUpperCase() );它可以转换userIDUser ID,甚至可以转换userIDFieldUser ID Field
Eugene Mala

87

我对此没有兴趣,特别是在处理大写顺序时,例如在xmlHTTPRequest中。列出的函数将产生“ Xml HTTP Request”或“ Xml HTTPRequest”,而我的产生“ Xml HTTP Request”。

function unCamelCase (str){
    return str
        // insert a space between lower & upper
        .replace(/([a-z])([A-Z])/g, '$1 $2')
        // space before last upper in a sequence followed by lower
        .replace(/\b([A-Z]+)([A-Z])([a-z])/, '$1 $2$3')
        // uppercase the first character
        .replace(/^./, function(str){ return str.toUpperCase(); })
}

要点中还有一个String.prototype版本。


使用2个替换调用可以实现相同的效果:str.replace(/((?<!^)[A-Z](?![A-Z]))(?=\S)/g, ' $1').replace(/^./, s => s.toUpperCase() )
尤金·马拉

22

可以使用正则表达式预演(live demo)简洁地完成此操作:

function splitCamelCaseToString(s) {
    return s.split(/(?=[A-Z])/).join(' ');
}

(我认为g(全局)标志是必要的,但奇怪的是,在这种情况下不是必需的。)

split如果您需要处理UpperCamelCase,则使用lookahead with 确保不会消耗匹配的大写字母,并且避免处理前导空格。要大写每个字母的首字母,可以使用:

function splitCamelCaseToString(s) {
    return s.split(/(?=[A-Z])/).map(function(p) {
        return p.charAt(0).toUpperCase() + p.slice(1);
    }).join(' ');
}

map阵列方法是ES5功能,但你仍然可以使用它在旧的浏览器从MDC一些代码。另外,您可以使用循环遍历数组元素for


First函数会拆分它,但不会PascalCase First单词。在没有驼峰的情况下,第二个功能失败。(例如:“ id”)
Dementic

16

我认为这应该能够处理连续的大写字符以及简单的camelCase。

例如:someVariable => someVariable,但是ABCCode!= ABC代码。

下面的正则表达式适用于您的示例,但也适用于在camcelCase中表示缩写的常见示例。

"somethingLikeThis"
    .replace(/([a-z])([A-Z])/g, '$1 $2')
    .replace(/([A-Z])([a-z])/g, ' $1$2')
    .replace(/\ +/g, ' ') => "something Like This"

"someVariableWithABCCode"
    .replace(/([a-z])([A-Z])/g, '$1 $2')
    .replace(/([A-Z])([a-z])/g, ' $1$2')
    .replace(/\ +/g, ' ') => "some Variable With ABC Code"

您还可以按上述方式进行调整以大写第一个字符。


10
function spacecamel(s){
    return s.replace(/([a-z])([A-Z])/g, '$1 $2');
}

spacecamel('somethingLikeThis')

//返回值:类似这样的内容


1
好一个!这正是我想要拆分的需求,例如:DiscoveryChannel和HBO其他答案给了我Discovery Channel和HBO,但由于HBO完好无损,您的回答对我来说很成功!
AJS


4

也可以处理数字的解决方案:

function capSplit(str){
   return str.replace
      ( /(^[a-z]+)|[0-9]+|[A-Z][a-z]+|[A-Z]+(?=[A-Z][a-z]|[0-9])/g
      , function(match, first){
          if (first) match = match[0].toUpperCase() + match.substr(1);
          return match + ' ';
          }
       )
   }

在这里进行了测试[JSFiddle,没有库。未尝试过IE];应该很稳定。


0

如果您不关心较旧的浏览器(或不介意为它们使用后备还原功能),这甚至可以分割诸如“ xmlHTTPRequest”之类的字符串(但可以肯定地说诸如“ XMLHTTPRequest”之类的字符串不能)。

function splitCamelCase(str) {
        return str.split(/(?=[A-Z])/)
                  .reduce(function(p, c, i) {
                    if (c.length === 1) {
                        if (i === 0) {
                            p.push(c);
                        } else {
                            var last = p.pop(), ending = last.slice(-1);
                            if (ending === ending.toLowerCase()) {
                                p.push(last);
                                p.push(c);
                            } else {
                                p.push(last + c);
                            }
                        }
                    } else {
                        p.push(c.charAt(0).toUpperCase() + c.slice(1));
                    }
                    return p;
                  }, [])
                  .join(' ');
}

0

我的版本

function camelToSpace (txt) {
  return txt
    .replace(/([^A-Z]*)([A-Z]*)([A-Z])([^A-Z]*)/g, '$1 $2 $3$4')
    .replace(/ +/g, ' ')
}
camelToSpace("camelToSpaceWithTLAStuff") //=> "camel To Space With TLA Stuff"

我在3000行中循环应用了此功能,并在每行以大写
字母

0

在这里尝试此解决方案-

var value = "myCamelCaseText";
var newStr = '';
for (var i = 0; i < value.length; i++) {
  if (value.charAt(i) === value.charAt(i).toUpperCase()) {
    newStr = newStr + ' ' + value.charAt(i)
  } else {
    (i == 0) ? (newStr += value.charAt(i).toUpperCase()) : (newStr += value.charAt(i));
  }
}
return newStr;

-5

不是正则表达式,但是对于了解像这样的普通和旧技术很有用:

var origString = "thisString";
var newString = origString.charAt(0).toUpperCase() + origString.substring(1);

5
不,问题是“ thisString”到“ This String”(带空格)而不是“ ThisString”
Pete Kirkham 2010年

@rob如何在“ this”和“ String”之间放置空格?
ThunderBird
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.