Wie konvertiere ich "camelCase" in "Camel Case"?

Ich habe versucht, einen JavaScript-Regex-Befehl zu erhalten, um so etwas "thisString"in etwas umzuwandeln, "This String"aber das nächste, was ich bekommen habe, ist das Ersetzen eines Buchstabens, was zu etwas wie "Thi String"oder führt "This tring". Irgendwelche Ideen?

Um zu klären , ich die Einfachheit der Kapitalisierung einen Brief umgehen kann, bin ich einfach nicht so stark mit RegEx und Spaltung "somethingLikeThis"in "something Like This"ist , wo ich Probleme habe.

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

Anzeigen

This String Is Good

(function() {

  const textbox = document.querySelector('#textbox')
  const result = document.querySelector('#result')
  function split() {
      result.innerText = textbox.value
        // insert a space before all caps
        .replace(/([A-Z])/g, ' $1')
        // uppercase the first character
        .replace(/^./, (str) => str.toUpperCase())
    };

  textbox.addEventListener('input', split);
  split();
}());

#result {
  margin-top: 1em;
  padding: .5em;
  background: #eee;
  white-space: pre;
}

<div>
  Text to split
  <input id="textbox" value="thisStringIsGood" />
</div>

<div id="result"></div>

Ich hatte ein müßiges Interesse daran, insbesondere an der Behandlung von Großbuchstabenfolgen, wie z. B. an xmlHTTPRequest. Die aufgelisteten Funktionen würden "Xml HTTP Request" oder "Xml HTTPRequest" erzeugen, meine "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(); })
}

Es gibt auch eine String.prototype-Version in einem Kern .

Dies kann mit Regex Lookahead ( Live-Demo ) präzise erfolgen :

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

(Ich dachte, dass die g (globale) Flagge notwendig ist, aber seltsamerweise ist dies in diesem speziellen Fall nicht der Fall.)

Durch die Verwendung von Lookahead mit wird splitsichergestellt, dass der übereinstimmende Großbuchstabe nicht verbraucht wird, und es wird vermieden, mit einem führenden Leerzeichen umzugehen, wenn Sie sich mit UpperCamelCase befassen müssen. Um den ersten Buchstaben eines jeden zu groß zu schreiben, können Sie Folgendes verwenden:

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

Die mapArray-Methode ist eine ES5-Funktion, Sie können sie jedoch in älteren Browsern mit etwas Code aus MDC verwenden . Alternativ können Sie die Array-Elemente mithilfe einer forSchleife durchlaufen .

Ich denke, dies sollte in der Lage sein, aufeinanderfolgende Großbuchstaben sowie einfache camelCase zu verarbeiten.

Zum Beispiel: someVariable => someVariable, aber ABCCode! = ABC Code.

Der folgende reguläre Ausdruck funktioniert in Ihrem Beispiel, aber auch im allgemeinen Beispiel für die Darstellung von Abkürzungen in 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"

Sie können auch wie oben anpassen, um das erste Zeichen groß zu schreiben.

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

Spacecamel ('etwas wie dieses')

// zurückgegebener Wert: so etwas

Lodash handhabt dies gut mit_.startCase()

Eine Lösung, die auch mit Zahlen umgeht:

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

Hier getestet [JSFiddle, keine Bibliothek. Nicht versucht IE]; sollte ziemlich stabil sein.

Wenn Sie sich nicht für ältere Browser interessieren (oder nichts dagegen haben, eine Fallback- Reduktionsfunktion für sie zu verwenden), kann dies sogar Zeichenfolgen wie 'xmlHTTPRequest' aufteilen (aber sicherlich können solche wie 'XMLHTTPRequest' dies nicht).

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

Meine Version

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"

Probieren Sie diese Lösung hier aus -

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;

Nicht Regex, aber nützlich, um einfache und alte Techniken wie diese zu kennen:

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