Question

我一直在尝试使用JavaScript regex命令将thisString之类的内容转换为This String，但我最接近的是更换字母，导致类似Thi String的内容或This tring。有什么想法吗？

为了澄清我可以处理大写字母的简单性，我对RegEx并不那么强大，将somethingLikeThis分成something Like This就是我遇到麻烦的地方。

Answer 1

"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

(function() {

  var $textbox = $('#textbox'),
    $result = $('#result'),
    splitter = function() {
      $result.html($textbox.val()
        // insert a space before all caps
        .replace(/([A-Z])/g, ' $1')
        // uppercase the first character
        .replace(/^./, function(str) {
          return str.toUpperCase();
        }));
    };

  $textbox.on('input', splitter);
  
  splitter();
}());

#result {
  margin-top: 10px;
  padding-top: 10px;
  border-top: solid 1px #c3c3c3;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  Text to split
  <input id="textbox" value="thisStringIsGood" />
</div>

<div id="result"></div>

Answer 2

我对此很感兴趣，特别是在处理大写序列时，例如在xmlHTTPRequest中。列出的函数将产生“Xml H T T P 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版本in a gist。

Answer 3

这可以通过正则表达式预测（live demo）简洁地完成：

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

（我认为g（全局）标志是必要的，但奇怪的是，它不是在这种特殊情况下。）

使用带有split的前瞻确保不会消耗匹配的大写字母，并且如果您需要处理UpperCamelCase，则可以避免处理前导空格。要将每个字母的首字母大写，您可以使用：

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

map数组方法是ES5功能，但您仍然可以在some code from MDC的旧浏览器中使用它。或者，您可以使用for循环遍历数组元素。

Answer 4

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

例如：someVariable =＆gt; someVariable，但ABCCode！= A B C代码。

以下正则表达式适用于您的示例，但也是表示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"

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

Answer 5

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

spacecamel（ 'somethingLikeThis'）

//返回值：类似于此

Answer 6

Lodash可以很好地处理_.startCase()

Answer 7

处理数字的解决方案：

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 + ' ';
          }
       )
   }

Tested here [JSFiddle, no library.没试过IE];应该很稳定。

Answer 8

如果您不关心旧浏览器（或者不介意使用后备 reduce 功能），这甚至可以拆分像'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(' ');
}

Answer 9

我的版本

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"

Answer 10

在这里尝试此解决方案-

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;

Answer 11

const value = 'camelCase';
const map = {};
let index = 0;
map[index] = [];
for (let i = 0; i < value.length; i++) {
  if (i !== 0 && value[i] === value[i].toUpperCase()) {
    index = i;
    map[index] = [];
  }
  if (i === 0) {
    map[index].push(value[i].toUpperCase());
  } else {
    map[index].push(value[i]);
  }
}
let resultArray = [];
Object.keys(map).map(function (key, index) {
  resultArray = [...resultArray, ' ', ...map[key]];
  return resultArray;
});
console.log(resultArray.join(''));

Answer 12

不是正则表达式，但对于了解像这样的简单旧技术很有用。

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

Javascript camelCase to Regular Form

12 个答案: