keldar
keldar

Reputation: 6252

Regex to split camel case

I have a regular expression in JavaScript to split my camel case string at the upper-case letters using the following code (which I subsequently got from here):

"MyCamelCaseString"
    .replace(/([A-Z])/g, ' $1')
    .replace(/^./, function(str){ return str.toUpperCase(); })

Thus that returns:

"My Camel Case String"

Which is good. However, I want to step this up a notch. Could someone help me with a regex which will split if, and only if, the former character is lower-case and the latter is upper-case.

Thus, the above example will be the result I expect, but if I do:

"ExampleID"

Then I get returned:

"Example ID"

Instead of

"Example I D"

Since it's splitting at each upper-case and ignoring anything before it.

Hope that makes sense! And thanks :).

Upvotes: 97

Views: 87821

Answers (14)

psygo
psygo

Reputation: 7583

Here is what I got from Github Copilot — the explanation is mine, this is not fully AI generated —:

  1. Put a space in front a capital letters via the /([A-Z])/g regex.
  2. Capitalize whatever is at the beginning of the string via the /^./ regex.
  3. Trim the leading and trailing white space with the .trim() method.

Here is the final code:

function camelCaseToCapitalized(str: string) {
  return str
    .replace(/([A-Z])/g, " $1")
    .replace(/^./, (str) => str.toUpperCase())
    .trim();
}

Upvotes: 0

Benito Gómez
Benito Gómez

Reputation: 35

Hi I saw no live demo , thanks @michiel-dral

var tests =[ "camelCase",
             "simple",
             "number1Case2",
             "CamelCaseXYZ",
             "CamelCaseXYZa" 
           ]

function getCamelCaseArray(camel) {
  var reg = /([a-z0-9])([A-Z])/g;
  return camel.replace(reg, '$1 $2').split(' ');
}

function printTest(test) {
document.write('<p>'+test + '=' + getCamelCaseArray(test)+'</p>');
}

tests.forEach(printTest);
<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
  </body>

</html>

Upvotes: 3

Luke Garrigan
Luke Garrigan

Reputation: 5011

If you're like me and had a camelCase value such as:

thisIsMyCamelCaseValue where the first letter is lowercased

function fromCamelCase(value) {
    const spaced = value.replace(/([a-z])([A-Z])/g, '$1 $2');
    return spaced.charAt(0).toUpperCase() + spaced.slice(1);
}

Upvotes: 2

Jordan
Jordan

Reputation: 159

I recently came across this question and needed to do the exact same thing:

employeeID should be rendered as Employee ID

I found this convert case library from zellwk plus a little additional reduce function did the trick for me:

import { toTitle } from "./convert-case.js";

// NB. Assumes sequential single chars can be concatenated
// ex. N B A Finals => NBA Finals
const reducer = (total, currentValue, currentIndex, arr) => {
  if (
    currentValue.length === 1 &&
    !(currentIndex > 0 && arr[currentIndex - 1].length > 1)
  ) {
    return total + currentValue;
  } else {
    return total + " " + currentValue;
  }
};

const concatSingleChars = (title) => {
  const arrTitle = title.split(" ");
  return arrTitle.reduce(reducer);
};

const convertCase = (str) => {
  const s = toTitle(str);
  return concatSingleChars(s);
};

const tests = [
  "colName",
  "This_Is_A_title",
  "And_How_About_thisOne",
  "MaryHadALittleLamb",
  "employeeID",
  "N B A Finals",
  "N B A Finals in L A",
  "I Love L A"
];

const titles = tests.map((test) => {
  return convertCase(test);
});

console.log(titles);

Upvotes: 0

Eugene
Eugene

Reputation: 2878

Sometime camelCase strings include abbreviations, for example:

PDFSplitAndMergeSamples
PDFExtractorSDKSamples
PDFRendererSDKSamples
BarcodeReaderSDKSamples

And in this case the following function will work, it splits the string leaving abbreviations as separate strings:

function SplitCamelCaseWithAbbreviations(s){
   return s.split(/([A-Z][a-z]+)/).filter(function(e){return e});
}

Example:

function SplitCamelCaseWithAbbreviations(s){
   return s.split(/([A-Z][a-z]+)/).filter(function(e){return e});
}

console.log(SplitCamelCaseWithAbbreviations('PDFSplitAndMergeSamples'));
console.log(SplitCamelCaseWithAbbreviations('PDFExtractorSDKSamples'));
console.log(SplitCamelCaseWithAbbreviations('PDFRendererSDKSamples'));
console.log(SplitCamelCaseWithAbbreviations('BarcodeReaderSDKSamples'));

Upvotes: 23

matt
matt

Reputation: 43

a = 'threeBlindMice'
a.match(/[A-Z]?[a-z]+/g) // [ 'three', 'Blind', 'Mice' ]

is the simplest way I've found, for simple camel/titlecase splitting.

Upvotes: 2

Richtopia
Richtopia

Reputation: 380

I found that none of the answers for this question really worked in all cases and also not at all for unicode strings, so here's one that does everything, including dash and underscore notation splitting.

let samples = [
  "ThereIsWay_too  MuchCGIInFilms These-days",
  "UnicodeCanBeCAPITALISEDTooYouKnow",
  "CAPITALLetters at the StartOfAString_work_too",
  "As_they_DoAtTheEND",
  "BitteWerfenSie-dieFußballeInDenMüll",
  "IchHabeUberGesagtNichtÜber",
  "2BeOrNot2Be",
  "ICannotBelieveThe100GotRenewed. It-isSOOOOOOBad"
];

samples.forEach(sample => console.log(sample.replace(/([^[\p{L}\d]+|(?<=[\p{Ll}\d])(?=\p{Lu})|(?<=\p{Lu})(?=\p{Lu}[\p{Ll}\d])|(?<=[\p{L}\d])(?=\p{Lu}[\p{Ll}\d]))/gu, '-').toUpperCase()));

If you don't want numbers treated as lower case letters, then:

let samples = [
  "2beOrNot2Be",
  "ICannotBelieveThe100GotRenewed. It-isSOOOOOOBad"
];

samples.forEach(sample => console.log(sample.replace(/([^\p{L}\d]+|(?<=\p{L})(?=\d)|(?<=\d)(?=\p{L})|(?<=[\p{Ll}\d])(?=\p{Lu})|(?<=\p{Lu})(?=\p{Lu}\p{Ll})|(?<=[\p{L}\d])(?=\p{Lu}\p{Ll}))/gu, '-').toUpperCase()));

Upvotes: 5

alzed
alzed

Reputation: 39

Regex not-a word boundary \B character can also be used

console.log("MyCamelCaseString".replace(/(\B[A-Z])/g, ' $1'));

Upvotes: 3

Behnam Azimi
Behnam Azimi

Reputation: 2488

You can use a combination of regEx, replace, and trim.

"ABCMyCamelCaseSTR".replace(/([A-Z][a-z0-9]+)/g, ' $1 ')
                   .replace(/\s{2}/g," ").trim()

// ABC My Camel Case STR

Upvotes: 0

Rimian
Rimian

Reputation: 38418

I prefer to work with arrays over strings. It's easier to debug and more flexible. This is an actual join instead of replace. I haven't dealt with white spaces in the strings but you could just trim each element easily enough.

const splitCamelCase = str => str.match(/^[A-Z]?[^A-Z]*|[A-Z][^A-Z]*/g).join(' ');

console.log(splitCamelCase('fooMyCamelCaseString'));
console.log(splitCamelCase('MyCamelCaseString'));
console.log(splitCamelCase('XYZMyCamelCaseString'));
console.log(splitCamelCase('alllowercase'));

Upvotes: 0

Michiel Dral
Michiel Dral

Reputation: 4077

My guess is replacing /([A-Z])/ with /([a-z])([A-Z])/ and ' $1' with '$1 $2'

"MyCamelCaseString"
    .replace(/([a-z])([A-Z])/g, '$1 $2');

/([a-z0-9])([A-Z])/ for numbers counting as lowercase characters

console.log("MyCamelCaseStringID".replace(/([a-z0-9])([A-Z])/g, '$1 $2'))

Upvotes: 182

brielov
brielov

Reputation: 1957

If you want an array of lower case words:

"myCamelCaseString".split(/(?=[A-Z])/).map(s => s.toLowerCase());

If you want a string of lower case words:

"myCamelCaseString".split(/(?=[A-Z])/).map(s => s.toLowerCase()).join(' ');

If you want to separate the words but keep the casing:

"myCamelCaseString".replace(/([a-z])([A-Z])/g, '$1 $2')

Upvotes: 31

John
John

Reputation: 1

This RegExp String is

.replace("/([a-zA-Z][a-z]*)/g",...);

Upvotes: -4

Adrian Salazar
Adrian Salazar

Reputation: 5319

"MyCamelCaseString".replace(/([a-z](?=[A-Z]))/g, '$1 ')

outputs:

"My Camel Case String"

Upvotes: 49

Related Questions