Jak przekonwertować „camelCase” na „Camel Case”?

Próbowałem uzyskać polecenie JavaScript regex, aby zamienić coś "thisString"w stylu, "This String"ale najbliższe mi jest zastąpienie litery, co skutkuje czymś w rodzaju "Thi String"lub "This tring". Jakieś pomysły?

Aby wyjaśnić, że potrafię poradzić sobie z prostotą pisania wielkimi literami, po prostu nie jestem tak silny w przypadku wyrażeń regularnych, a dzielenie się "somethingLikeThis"na "something Like This"to, gdzie mam problemy.

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

wyświetlacze

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>

Byłem tym bezinteresownie zainteresowany, szczególnie w obsłudze sekwencji wielkich liter, na przykład w xmlHTTPRequest. Wymienione funkcje wygenerowałyby „Żądanie Xml HTTP” lub „Żądanie Xml HTTP”, moja daje „Żądanie Xml HTTP”.

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

Istnieje również wersja String.prototype w GIST .

Można to zwięźle zrobić za pomocą regex lookahead ( demo na żywo ):

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

(Myślałem, że gflaga (globalna) jest konieczna, ale co dziwne, nie jest w tym konkretnym przypadku).

Używanie lookahead with splitzapewnia, że ​​dopasowana wielka litera nie jest używana i pozwala uniknąć zajmowania się spacją wiodącą, jeśli UpperCamelCase jest czymś, z czym musisz sobie poradzić. Aby zacząć wielką literę każdego z nich, możesz użyć:

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

Metoda maptablicowa jest funkcją ES5, ale nadal można jej używać w starszych przeglądarkach z pewnym kodem z MDC . Alternatywnie możesz iterować po elementach tablicy przy użyciu forpętli.

Myślę, że to powinno być w stanie obsłużyć kolejne wielkie litery, a także proste camelCase.

Na przykład: someVariable => someVariable, ale ABCCode! = ABC Code.

Poniższe wyrażenie regularne działa na Twoim przykładzie, ale jest też typowym przykładem reprezentowania skrótów w 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"

Możesz również dostosować, jak powyżej, aby wykorzystać pierwszy znak.

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

spacecamel („somethingLikeThis”)

// zwrócona wartość: coś takiego

Lodash dobrze sobie z tym radzi_.startCase()

Rozwiązanie, które obsługuje również liczby:

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

Testowane tutaj [JSFiddle, brak biblioteki. Nie próbowano IE]; powinien być dość stabilny.

Jeśli nie przejmujesz się starszymi przeglądarkami (lub nie masz nic przeciwko używaniu dla nich funkcji awaryjnej redukcji ), możesz podzielić nawet ciągi znaków, takie jak „xmlHTTPRequest” (ale z pewnością nie da się tego zrobić w przypadku „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(' ');
}

Moja wersja

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"

Wypróbuj to rozwiązanie tutaj -

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;

Nie regex, ale warto znać proste i stare techniki, takie jak ta:

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